<!doctype html>
<html>
<head>
<meta charset='UTF-8'><meta name='viewport' content='width=device-width initial-scale=1'>
<meta name="author" content="MAX°孟兆">
<meta name="keywords" content="Markdown,Typora,VLOOK,Plugin,插件,主题包,自动排版,跨平台,i18n,开源,MIT,开源中国,OSC,编辑推荐, 表格增强,单元格合并,行分组,表格阅读模式,表格十字光标,重复表头,刮刮卡,黑幕,标签,图片增强,演示辅助,聚光灯,激光笔,自动折叠,打印,Mermaid,音频,视频,注音,主题,字体,模板,深色模式,Dark Mode,封面,封底,私人定制, PRD,设计,需求,文档,博客,手册,指南,在线,运维,知识库,WIKI, 产品经理,程序员,运维工程师,售前,售后">
<meta name="vlook-welcome" content="${vlook-welcome}">
<meta name="vlook-query" content="effects=2&amp;ws=auto&amp;lmc=1">
<meta name="vlook-doc-lib" content="vlook-lib.html">
<style type='text/css'>html {overflow-x: initial !important;}:root { --mermaid-theme:  default; --mermaid-sequence-numbers:  off; --mermaid-flowchart-curve:  linear; --mermaid--gantt-left-padding:  75; --sequence-theme:  simple; }


:root { --bg-color: #ffffff; --text-color: #333333; --select-text-bg-color: #B5D6FC; --select-text-font-color: auto; --monospace: "Lucida Console",Consolas,"Courier",monospace; --title-bar-height: 20px; }
.mac-os-11 { --title-bar-height: 28px; }
html { font-size: 14px; background-color: var(--bg-color); color: var(--text-color); font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; -webkit-font-smoothing: antialiased; }
body { margin: 0px; padding: 0px; height: auto; inset: 0px; font-size: 1rem; line-height: 1.42857143; overflow-x: hidden; background-image: inherit; background-size: inherit; background-attachment: inherit; background-origin: inherit; background-clip: inherit; background-color: inherit; tab-size: 4; background-position: inherit; background-repeat: inherit; }
iframe { margin: auto; }
a.url { word-break: break-all; }
a:active, a:hover { outline: 0px; }
.in-text-selection, ::selection { text-shadow: none; background: var(--select-text-bg-color); color: var(--select-text-font-color); }
#write { margin: 0px auto; height: auto; width: inherit; word-break: normal; word-wrap: break-word; position: relative; white-space: normal; overflow-x: visible; padding-top: 36px; }
#write.first-line-indent p { text-indent: 2em; }
#write.first-line-indent li p, #write.first-line-indent p * { text-indent: 0px; }
#write.first-line-indent li { margin-left: 2em; }
.for-image #write { padding-left: 8px; padding-right: 8px; }
body.typora-export { padding-left: 30px; padding-right: 30px; }
.typora-export .footnote-line, .typora-export li, .typora-export p { white-space: pre-wrap; }
.typora-export .task-list-item input { pointer-events: none; }
@media screen and (max-width: 500px) { 
  body.typora-export { padding-left: 0px; padding-right: 0px; }
  #write { padding-left: 20px; padding-right: 20px; }
  .CodeMirror-sizer { margin-left: 0px !important; }
  .CodeMirror-gutters { display: none !important; }
}
#write li > figure:last-child { margin-bottom: 0.5rem; }
#write ol, #write ul { position: relative; }
img { max-width: 100%; vertical-align: middle; image-orientation: from-image; }
button, input, select, textarea { color: inherit; font-family: inherit; font-size: inherit; font-style: inherit; font-variant-caps: inherit; font-weight: inherit; font-stretch: inherit; line-height: inherit; }
input[type="checkbox"], input[type="radio"] { line-height: normal; padding: 0px; }
*, ::after, ::before { box-sizing: border-box; }
#write h1, #write h2, #write h3, #write h4, #write h5, #write h6, #write p, #write pre { width: inherit; }
#write h1, #write h2, #write h3, #write h4, #write h5, #write h6, #write p { position: relative; }
p { line-height: inherit; }
h1, h2, h3, h4, h5, h6 { break-after: avoid-page; break-inside: avoid; orphans: 4; }
p { orphans: 4; }
h1 { font-size: 2rem; }
h2 { font-size: 1.8rem; }
h3 { font-size: 1.6rem; }
h4 { font-size: 1.4rem; }
h5 { font-size: 1.2rem; }
h6 { font-size: 1rem; }
.md-math-block, .md-rawblock, h1, h2, h3, h4, h5, h6, p { margin-top: 1rem; margin-bottom: 1rem; }
.hidden { display: none; }
.md-blockmeta { color: rgb(204, 204, 204); font-weight: 700; font-style: italic; }
a { cursor: pointer; }
sup.md-footnote { padding: 2px 4px; background-color: rgba(238, 238, 238, 0.7); color: rgb(85, 85, 85); border-top-left-radius: 4px; border-top-right-radius: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px; cursor: pointer; }
sup.md-footnote a, sup.md-footnote a:hover { color: inherit; text-transform: inherit; text-decoration: inherit; }
#write input[type="checkbox"] { cursor: pointer; width: inherit; height: inherit; }
figure { overflow-x: auto; margin: 1.2em 0px; max-width: calc(100% + 16px); padding: 0px; }
figure > table { margin: 0px; }
tr { break-inside: avoid; break-after: auto; }
thead { display: table-header-group; }
table { border-collapse: collapse; border-spacing: 0px; width: 100%; overflow: auto; break-inside: auto; text-align: left; }
table.md-table td { min-width: 32px; }
.CodeMirror-gutters { border-right-width: 0px; background-color: inherit; }
.CodeMirror-linenumber { }
.CodeMirror { text-align: left; }
.CodeMirror-placeholder { opacity: 0.3; }
.CodeMirror pre { padding: 0px 4px; }
.CodeMirror-lines { padding: 0px; }
div.hr:focus { cursor: none; }
#write pre { white-space: pre-wrap; }
#write.fences-no-line-wrapping pre { white-space: pre; }
#write pre.ty-contain-cm { white-space: normal; }
.CodeMirror-gutters { margin-right: 4px; }
.md-fences { font-size: 0.9rem; display: block; break-inside: avoid; text-align: left; overflow: visible; white-space: pre; background-image: inherit; background-size: inherit; background-attachment: inherit; background-origin: inherit; background-clip: inherit; background-color: inherit; position: relative !important; background-position: inherit; background-repeat: inherit; }
.md-fences-adv-panel { width: 100%; margin-top: 10px; text-align: center; padding-top: 0px; padding-bottom: 8px; overflow-x: auto; }
#write .md-fences.mock-cm { white-space: pre-wrap; }
.md-fences.md-fences-with-lineno { padding-left: 0px; }
#write.fences-no-line-wrapping .md-fences.mock-cm { white-space: pre; overflow-x: auto; }
.md-fences.mock-cm.md-fences-with-lineno { padding-left: 8px; }
.CodeMirror-line, twitterwidget { break-inside: avoid; }
.footnotes { opacity: 0.8; font-size: 0.9rem; margin-top: 1em; margin-bottom: 1em; }
.footnotes + .footnotes { margin-top: 0px; }
.md-reset { margin: 0px; padding: 0px; border: 0px; outline: 0px; vertical-align: top; text-decoration: none; text-shadow: none; float: none; position: static; width: auto; height: auto; white-space: nowrap; cursor: inherit; line-height: normal; font-weight: 400; text-align: left; box-sizing: content-box; direction: ltr; background-position: 0px 0px; }
li div { padding-top: 0px; }
blockquote { margin: 1rem 0px; }
li .mathjax-block, li p { margin: 0.5rem 0px; }
li blockquote { margin: 1rem 0px; }
li { margin: 0px; position: relative; }
blockquote > :last-child { margin-bottom: 0px; }
blockquote > :first-child, li > :first-child { margin-top: 0px; }
.footnotes-area { color: rgb(136, 136, 136); margin-top: 0.714rem; padding-bottom: 0.143rem; white-space: normal; }
#write .footnote-line { white-space: pre-wrap; }
@media print { 
  body, html { border: 1px solid transparent; height: 99%; break-after: avoid; break-before: avoid; font-variant-ligatures: no-common-ligatures; }
  #write { margin-top: 0px; padding-top: 0px; border-color: transparent !important; }
  .typora-export * { -webkit-print-color-adjust: exact; }
  .typora-export #write { break-after: avoid; }
  .typora-export #write::after { height: 0px; }
  .is-mac table { break-inside: avoid; }
  .typora-export-show-outline .typora-export-sidebar { display: none; }
}
.footnote-line { margin-top: 0.714em; font-size: 0.7em; }
a img, img a { cursor: pointer; }
pre.md-meta-block { font-size: 0.8rem; min-height: 0.8rem; white-space: pre-wrap; background-color: rgb(204, 204, 204); display: block; overflow-x: hidden; }
p > .md-image:only-child:not(.md-img-error) img, p > img:only-child { display: block; margin: auto; }
#write.first-line-indent p > .md-image:only-child:not(.md-img-error) img { left: -2em; position: relative; }
p > .md-image:only-child { display: inline-block; width: 100%; }
#write .MathJax_Display { margin: 0.8em 0px 0px; }
.md-math-block { width: 100%; }
.md-math-block:not(:empty)::after { display: none; }
.MathJax_ref { fill: currentcolor; }
[contenteditable="true"]:active, [contenteditable="true"]:focus, [contenteditable="false"]:active, [contenteditable="false"]:focus { outline: 0px; box-shadow: none; }
.md-task-list-item { position: relative; list-style-type: none; }
.task-list-item.md-task-list-item { padding-left: 0px; }
.md-task-list-item > input { position: absolute; top: 0px; left: 0px; margin-left: -1.2em; margin-top: calc(1em - 10px); border: none; }
.math { font-size: 1rem; }
.md-toc { min-height: 3.58rem; position: relative; font-size: 0.9rem; border-top-left-radius: 10px; border-top-right-radius: 10px; border-bottom-right-radius: 10px; border-bottom-left-radius: 10px; }
.md-toc-content { position: relative; margin-left: 0px; }
.md-toc-content::after, .md-toc::after { display: none; }
.md-toc-item { display: block; color: rgb(65, 131, 196); }
.md-toc-item a { text-decoration: none; }
.md-toc-inner:hover { text-decoration: underline; }
.md-toc-inner { display: inline-block; cursor: pointer; }
.md-toc-h1 .md-toc-inner { margin-left: 0px; font-weight: 700; }
.md-toc-h2 .md-toc-inner { margin-left: 2em; }
.md-toc-h3 .md-toc-inner { margin-left: 4em; }
.md-toc-h4 .md-toc-inner { margin-left: 6em; }
.md-toc-h5 .md-toc-inner { margin-left: 8em; }
.md-toc-h6 .md-toc-inner { margin-left: 10em; }
@media screen and (max-width: 48em) { 
  .md-toc-h3 .md-toc-inner { margin-left: 3.5em; }
  .md-toc-h4 .md-toc-inner { margin-left: 5em; }
  .md-toc-h5 .md-toc-inner { margin-left: 6.5em; }
  .md-toc-h6 .md-toc-inner { margin-left: 8em; }
}
a.md-toc-inner { font-size: inherit; font-style: inherit; font-weight: inherit; line-height: inherit; }
.footnote-line a:not(.reversefootnote) { color: inherit; }
.md-attr { display: none; }
.md-fn-count::after { content: "."; }
code, pre, samp, tt { font-family: var(--monospace); }
kbd { margin: 0px 0.1em; padding: 0.1em 0.6em; font-size: 0.8em; color: rgb(36, 39, 41); background-color: rgb(255, 255, 255); border: 1px solid rgb(173, 179, 185); border-top-left-radius: 3px; border-top-right-radius: 3px; border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; box-shadow: rgba(12, 13, 14, 0.2) 0px 1px 0px, rgb(255, 255, 255) 0px 0px 0px 2px inset; white-space: nowrap; vertical-align: middle; }
.md-comment { color: rgb(162, 127, 3); opacity: 0.8; font-family: var(--monospace); }
code { text-align: left; }
a.md-print-anchor { white-space: pre !important; border: none !important; display: inline-block !important; position: absolute !important; width: 1px !important; right: 0px !important; outline: 0px !important; text-shadow: initial !important; background-position: 0px 0px !important; }
.os-windows.monocolor-emoji .md-emoji { font-family: "Segoe UI Symbol", sans-serif; }
.md-diagram-panel > svg { max-width: 100%; }
[lang="flow"] svg, [lang="mermaid"] svg { max-width: 100%; height: auto; }
[lang="mermaid"] .node text { font-size: 1rem; }
table tr th { border-bottom-width: 0px; }
video { max-width: 100%; display: block; margin: 0px auto; }
iframe { max-width: 100%; width: 100%; border: none; }
.highlight td, .highlight tr { border: 0px; }
mark { background-color: rgb(255, 255, 0); color: rgb(0, 0, 0); }
.md-html-inline .md-plain, .md-html-inline strong, mark .md-inline-math, mark strong { color: inherit; }
.md-expand mark .md-meta { opacity: 0.3 !important; }
mark .md-meta { color: rgb(0, 0, 0); }
@media print { 
  .typora-export h1, .typora-export h2, .typora-export h3, .typora-export h4, .typora-export h5, .typora-export h6 { break-inside: avoid; }
}
.md-diagram-panel .messageText { stroke: none !important; }
.md-diagram-panel .start-state { fill: var(--node-fill); }
.md-diagram-panel .edgeLabel rect { opacity: 1 !important; }
.md-require-zoom-fix { height: auto; margin-top: 16px; margin-bottom: 16px; }
.md-require-zoom-fix foreignObject { font-size: var(--mermaid-font-zoom); }
.md-fences.md-fences-math { font-size: 1em; }
.md-fences-advanced:not(.md-focus) { padding: 0px; white-space: nowrap; border: 0px; }
.md-fences-advanced:not(.md-focus) { background-image: inherit; background-size: inherit; background-attachment: inherit; background-origin: inherit; background-clip: inherit; background-color: inherit; background-position: inherit; background-repeat: inherit; }
.typora-export-show-outline .typora-export-content { max-width: 1440px; margin: auto; display: flex; flex-direction: row; }
.typora-export-sidebar { width: 300px; font-size: 0.8rem; margin-top: 80px; margin-right: 18px; }
.typora-export-show-outline #write { --webkit-flex: 2; flex: 2 1 0%; }
.typora-export-sidebar .outline-content { position: fixed; top: 0px; max-height: 100%; overflow: hidden auto; padding-bottom: 30px; padding-top: 60px; width: 300px; }
@media screen and (max-width: 1024px) { 
  .typora-export-sidebar, .typora-export-sidebar .outline-content { width: 240px; }
}
@media screen and (max-width: 800px) { 
  .typora-export-sidebar { display: none; }
}
.outline-content li, .outline-content ul { margin-left: 0px; margin-right: 0px; padding-left: 0px; padding-right: 0px; list-style: none; }
.outline-content ul { margin-top: 0px; margin-bottom: 0px; }
.outline-content strong { font-weight: 400; }
.outline-expander { width: 1rem; height: 1.428571429rem; position: relative; display: table-cell; vertical-align: middle; cursor: pointer; padding-left: 4px; }
.outline-expander::before { content: ''; position: relative; font-family: Ionicons; display: inline-block; font-size: 8px; vertical-align: middle; }
.outline-item { padding-top: 3px; padding-bottom: 3px; cursor: pointer; }
.outline-expander:hover::before { content: ''; }
.outline-h1 > .outline-item { padding-left: 0px; }
.outline-h2 > .outline-item { padding-left: 1em; }
.outline-h3 > .outline-item { padding-left: 2em; }
.outline-h4 > .outline-item { padding-left: 3em; }
.outline-h5 > .outline-item { padding-left: 4em; }
.outline-h6 > .outline-item { padding-left: 5em; }
.outline-label { cursor: pointer; display: table-cell; vertical-align: middle; text-decoration: none; color: inherit; }
.outline-label:hover { text-decoration: underline; }
.outline-item:hover { border-color: rgb(245, 245, 245); background-color: var(--item-hover-bg-color); }
.outline-item:hover { margin-left: -28px; margin-right: -28px; border-left-width: 28px; border-left-style: solid; border-left-color: transparent; border-right-width: 28px; border-right-style: solid; border-right-color: transparent; }
.outline-item-single .outline-expander::before, .outline-item-single .outline-expander:hover::before { display: none; }
.outline-item-open > .outline-item > .outline-expander::before { content: ''; }
.outline-children { display: none; }
.info-panel-tab-wrapper { display: none; }
.outline-item-open > .outline-children { display: block; }
.typora-export .outline-item { padding-top: 1px; padding-bottom: 1px; }
.typora-export .outline-item:hover { margin-right: -8px; border-right-width: 8px; border-right-style: solid; border-right-color: transparent; }
.typora-export .outline-expander::before { content: "+"; font-family: inherit; top: -1px; }
.typora-export .outline-expander:hover::before, .typora-export .outline-item-open > .outline-item > .outline-expander::before { content: '−'; }
.typora-export-collapse-outline .outline-children { display: none; }
.typora-export-collapse-outline .outline-item-open > .outline-children, .typora-export-no-collapse-outline .outline-children { display: block; }
.typora-export-no-collapse-outline .outline-expander::before { content: "" !important; }
.typora-export-show-outline .outline-item-active > .outline-item .outline-label { font-weight: 700; }
.md-inline-math-container mjx-container { zoom: 0.95; }


.CodeMirror { height: auto; }
.CodeMirror.cm-s-inner { background-image: inherit; background-size: inherit; background-attachment: inherit; background-origin: inherit; background-clip: inherit; background-color: inherit; background-position: inherit; background-repeat: inherit; }
.CodeMirror-scroll { overflow: auto hidden; z-index: 3; }
.CodeMirror-gutter-filler, .CodeMirror-scrollbar-filler { background-color: rgb(255, 255, 255); }
.CodeMirror-gutters { border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); background-image: inherit; background-size: inherit; background-attachment: inherit; background-origin: inherit; background-clip: inherit; background-color: inherit; white-space: nowrap; background-position: inherit; background-repeat: inherit; }
.CodeMirror-linenumber { padding: 0px 3px 0px 5px; text-align: right; color: rgb(153, 153, 153); }
.cm-s-inner .cm-keyword { color: rgb(119, 0, 136); }
.cm-s-inner .cm-atom, .cm-s-inner.cm-atom { color: rgb(34, 17, 153); }
.cm-s-inner .cm-number { color: rgb(17, 102, 68); }
.cm-s-inner .cm-def { color: rgb(0, 0, 255); }
.cm-s-inner .cm-variable { color: rgb(0, 0, 0); }
.cm-s-inner .cm-variable-2 { color: rgb(0, 85, 170); }
.cm-s-inner .cm-variable-3 { color: rgb(0, 136, 85); }
.cm-s-inner .cm-string { color: rgb(170, 17, 17); }
.cm-s-inner .cm-property { color: rgb(0, 0, 0); }
.cm-s-inner .cm-operator { color: rgb(152, 26, 26); }
.cm-s-inner .cm-comment, .cm-s-inner.cm-comment { color: rgb(170, 85, 0); }
.cm-s-inner .cm-string-2 { color: rgb(255, 85, 0); }
.cm-s-inner .cm-meta { color: rgb(85, 85, 85); }
.cm-s-inner .cm-qualifier { color: rgb(85, 85, 85); }
.cm-s-inner .cm-builtin { color: rgb(51, 0, 170); }
.cm-s-inner .cm-bracket { color: rgb(153, 153, 119); }
.cm-s-inner .cm-tag { color: rgb(17, 119, 0); }
.cm-s-inner .cm-attribute { color: rgb(0, 0, 204); }
.cm-s-inner .cm-header, .cm-s-inner.cm-header { color: rgb(0, 0, 255); }
.cm-s-inner .cm-quote, .cm-s-inner.cm-quote { color: rgb(0, 153, 0); }
.cm-s-inner .cm-hr, .cm-s-inner.cm-hr { color: rgb(153, 153, 153); }
.cm-s-inner .cm-link, .cm-s-inner.cm-link { color: rgb(0, 0, 204); }
.cm-negative { color: rgb(221, 68, 68); }
.cm-positive { color: rgb(34, 153, 34); }
.cm-header, .cm-strong { font-weight: 700; }
.cm-del { text-decoration: line-through; }
.cm-em { font-style: italic; }
.cm-link { text-decoration: underline; }
.cm-error { color: red; }
.cm-invalidchar { color: red; }
.cm-constant { color: rgb(38, 139, 210); }
.cm-defined { color: rgb(181, 137, 0); }
div.CodeMirror span.CodeMirror-matchingbracket { color: rgb(0, 255, 0); }
div.CodeMirror span.CodeMirror-nonmatchingbracket { color: rgb(255, 34, 34); }
.cm-s-inner .CodeMirror-activeline-background { background-image: inherit; background-size: inherit; background-attachment: inherit; background-origin: inherit; background-clip: inherit; background-color: inherit; background-position: inherit; background-repeat: inherit; }
.CodeMirror { position: relative; overflow: hidden; }
.CodeMirror-scroll { height: 100%; outline: 0px; position: relative; box-sizing: content-box; background-image: inherit; background-size: inherit; background-attachment: inherit; background-origin: inherit; background-clip: inherit; background-color: inherit; background-position: inherit; background-repeat: inherit; }
.CodeMirror-sizer { position: relative; }
.CodeMirror-gutter-filler, .CodeMirror-hscrollbar, .CodeMirror-scrollbar-filler, .CodeMirror-vscrollbar { position: absolute; z-index: 6; display: none; outline: 0px; }
.CodeMirror-vscrollbar { right: 0px; top: 0px; overflow: hidden; }
.CodeMirror-hscrollbar { bottom: 0px; left: 0px; overflow: auto hidden; }
.CodeMirror-scrollbar-filler { right: 0px; bottom: 0px; }
.CodeMirror-gutter-filler { left: 0px; bottom: 0px; }
.CodeMirror-gutters { position: absolute; left: 0px; top: 0px; padding-bottom: 10px; z-index: 3; overflow-y: hidden; }
.CodeMirror-gutter { white-space: normal; height: 100%; box-sizing: content-box; padding-bottom: 30px; margin-bottom: -32px; display: inline-block; }
.CodeMirror-gutter-wrapper { position: absolute; z-index: 4; border: none !important; background-position: 0px 0px !important; }
.CodeMirror-gutter-background { position: absolute; top: 0px; bottom: 0px; z-index: 4; }
.CodeMirror-gutter-elt { position: absolute; cursor: default; z-index: 4; }
.CodeMirror-lines { cursor: text; }
.CodeMirror pre { border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-right-radius: 0px; border-bottom-left-radius: 0px; border-width: 0px; font-family: inherit; font-size: inherit; margin: 0px; white-space: pre; word-wrap: normal; color: inherit; z-index: 2; position: relative; overflow: visible; background-position: 0px 0px; }
.CodeMirror-wrap pre { word-wrap: break-word; white-space: pre-wrap; word-break: normal; }
.CodeMirror-code pre { border-right-width: 30px; border-right-style: solid; border-right-color: transparent; width: fit-content; }
.CodeMirror-wrap .CodeMirror-code pre { border-right-style: none; width: auto; }
.CodeMirror-linebackground { position: absolute; inset: 0px; z-index: 0; }
.CodeMirror-linewidget { position: relative; z-index: 2; overflow: auto; }
.CodeMirror-wrap .CodeMirror-scroll { overflow-x: hidden; }
.CodeMirror-measure { position: absolute; width: 100%; height: 0px; overflow: hidden; visibility: hidden; }
.CodeMirror-measure pre { position: static; }
.CodeMirror div.CodeMirror-cursor { position: absolute; visibility: hidden; border-right-style: none; width: 0px; }
.CodeMirror div.CodeMirror-cursor { visibility: hidden; }
.CodeMirror-focused div.CodeMirror-cursor { visibility: inherit; }
.cm-searching { background-color: rgba(255, 255, 0, 0.4); }
span.cm-underlined { text-decoration: underline; }
span.cm-strikethrough { text-decoration: line-through; }
.cm-tw-syntaxerror { color: rgb(255, 255, 255); background-color: rgb(153, 0, 0); }
.cm-tw-deleted { text-decoration: line-through; }
.cm-tw-header5 { font-weight: 700; }
.cm-tw-listitem:first-child { padding-left: 10px; }
.cm-tw-box { border-style: solid; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-color: inherit; border-top-width: 0px !important; }
.cm-tw-underline { text-decoration: underline; }
@media print { 
  .CodeMirror div.CodeMirror-cursor { visibility: hidden; }
}


@keyframes breathe-text{0%{opacity:1;transform:scale(1.03)}to{opacity:.8;transform:scale(.99)}}@keyframes breathe-button{0%{opacity:1;transform:scale(1.1);filter:brightness(120%)}to{opacity:.8;transform:scale(1);filter:brightness(100%)}}@keyframes loading-circle{0%{transform:rotate(0deg)}to{transform:rotate(359deg)}}@keyframes breathe-circle{0%{box-shadow:0 0 0 0 rgba(119,53,204,.7)}to{box-shadow:0 0 0 3px rgba(119,53,204,.7)}}:root{--mm-sequence-numbers:on;--mm-flowchart-curve:basis;--vlook-theme-name:"vlook-owl";--vlook-theme-version:"V11-dev";--vlook-default-font-style:sans;--vlook-color-scheme:light;--vlook-nav-center-width:360px;--vlook-nav-center-hidden-left:-370px;--vlook-toolbar-btn-width:36px;--vlook-toolbar-btn-space:5px;--vlook-top-margin:8px;--vlook-transition-duration:200ms;--vlook-transition-value:all var(--vlook-transition-duration) ease-in-out;--vlook-base-radius:12px;--vlook-small-radius:6px;--vlook-table-radius:10px;--vlook-small-inner-radius:calc(var(--vlook-table-radius) - 2px);--vlook-tag-radius:0.5em;--vlook-tag-small-radius:0.25em;--vlook-circle-radius:50%;--vlook-invert-dark-light:invert(0) brightness(100%);--vlook-brightness-dark-light:brightness(100%);--doc-bg-color-light:#FFFFFF;--doc-bg-color-alt-light:#e6e6e6;--doc-bg-color-transparent-light:rgba(255, 255, 255, 0);--doc-bg-color-alt-transparent-light:rgba(230, 230, 230, 0);--fore-color-light:#181A1E;--fore-color-alt-light:#737c8f;--blockquote-bg-light:rgba(24, 26, 30, 0.1);--tips-bg-color-light:#E0E4E8;--tips-bg-color-inset-light:#181A1E;--a-color-light:#181A1E;--mark-color-light:rgba(0, 168, 190, 0.25);--tbl-border-color-light:rgba(176, 180, 184, 0.8);--tbl-header-color-light:#959ba0;--tbl-th-bg-color-light:rgba(176, 180, 184, 0.4);--tbl-td-bg-color-light:rgba(176, 180, 184, 0.2);--tbl-cell-border-color-light:rgba(176, 180, 184, 0.3);--tbl-row-g-alpha-light:0.15;--del-color-light:#737c8f;--toc-header-num-color-light:rgba(24, 26, 30, 0.5);--header-color-light:#00A8BE;--header-box-shadow-light:rgba(0, 168, 190, 0.2);--header-bg-start-color-light:rgba(0, 168, 190, 0);--header-bg-end-color-light:rgba(0, 168, 190, 0.1);--code-bg-color-light:#c8f9ff;--code-name-bg-color-light:#181A1E;--code-name-shadow-color-light:rgba(0, 0, 0, 0.3);--acc-color-red-light:#C72334;--acc-color-red-alt-light:#fcedef;--acc-color-red-fade-light:rgba(199, 35, 52, 0.25);--acc-color-red-title-light:#C72334;--acc-color-orange-light:#E27D09;--acc-color-orange-alt-light:#fdead3;--acc-color-orange-fade-light:rgba(226, 125, 9, 0.25);--acc-color-orange-title-light:#E27D09;--acc-color-yellow-light:#DEB307;--acc-color-yellow-alt-light:#fdf4cd;--acc-color-yellow-fade-light:rgba(222, 179, 7, 0.25);--acc-color-yellow-title-light:#DEB307;--acc-color-green-light:#38AB21;--acc-color-green-alt-light:#daf7d4;--acc-color-green-fade-light:rgba(56, 171, 33, 0.25);--acc-color-green-title-light:#38AB21;--acc-color-cyan-light:#18A8BF;--acc-color-cyan-alt-light:#dbf6fb;--acc-color-cyan-fade-light:rgba(24, 168, 191, 0.25);--acc-color-cyan-title-light:#18A8BF;--acc-color-blue-light:#056BF0;--acc-color-blue-alt-light:#dcebfe;--acc-color-blue-fade-light:rgba(5, 107, 240, 0.25);--acc-color-blue-title-light:#056BF0;--acc-color-purple-light:#7738DC;--acc-color-purple-alt-light:#dfd0f7;--acc-color-purple-fade-light:rgba(119, 56, 220, 0.25);--acc-color-purple-title-light:#7738DC;--acc-color-pink-light:#DB43B2;--acc-color-pink-alt-light:#f8d9ef;--acc-color-pink-fade-light:rgba(219, 67, 178, 0.25);--acc-color-pink-title-light:#DB43B2;--acc-color-brown-light:#A47546;--acc-color-brown-alt-light:#f1e8de;--acc-color-brown-fade-light:rgba(164, 117, 70, 0.25);--acc-color-brown-title-light:#A47546;--acc-color-gray-light:#7B7D82;--acc-color-gray-alt-light:#f1f1f2;--acc-color-gray-fade-light:rgba(123, 125, 130, 0.25);--acc-color-gray-title-light:#7B7D82;--acc-color-theme1-light:#00A8BE;--acc-color-theme1-alt-light:#c8f9ff;--acc-color-theme1-fade-light:rgba(0, 168, 190, 0.3);--acc-color-theme1-title-light:#00A8BE;--acc-color-theme2-light:#7735CC;--acc-color-theme2-alt-light:#eae0f7;--acc-color-theme2-fade-light:rgba(119, 53, 204, 0.3);--acc-color-theme2-title-light:#7735CC;--mm-color-red-light:#C72334;--mm-color-red-alt-light:#f0acb3;--mm-color-orange-light:#E27D09;--mm-color-orange-alt-light:#fbd2a2;--mm-color-yellow-light:#DEB307;--mm-color-yellow-alt-light:#fce99c;--mm-color-green-light:#38AB21;--mm-color-green-alt-light:#a3ea94;--mm-color-cyan-light:#18A8BF;--mm-color-cyan-alt-light:#98e6f2;--mm-color-blue-light:#056BF0;--mm-color-blue-alt-light:#aacefd;--mm-color-purple-light:#7738DC;--mm-color-purple-alt-light:#dfd0f7;--mm-color-pink-light:#DB43B2;--mm-color-pink-alt-light:#f8d9ef;--mm-color-brown-light:#A47546;--mm-color-brown-alt-light:#e2cebb;--mm-color-gray-light:#7B7D82;--mm-color-gray-alt-light:#d7d7d9;--cm-keyword-light:#770088;--cm-variable-light:#181A1E;--cm-variable-2-light:#0055AA;--cm-variable-3-light:#008855;--cm-tag-light:#117700;--cm-attribute-light:#0000CC;--cm-CodeMirror-cursor-light:#737c8f;--cm-string-light:#AA1111;--cm-string-2-light:#FF5500;--cm-comment-light:#AA5500;--cm-header-light:#0000FF;--cm-quote-light:#009900;--cm-hr-light:#999999;--cm-link-light:#0000CC;--cm-negative-light:#DD4444;--cm-positive-light:#229922;--cm-meta-light:#555555;--cm-bulidin-light:#3300AA;--cm-bracket-light:#999977;--cm-atom-light:#221199;--cm-number-light:#116644;--vlook-invert-dark-dark:invert(1) brightness(90%);--vlook-brightness-dark-dark:brightness(90%);--doc-bg-color-dark:#181A1E;--doc-bg-color-alt-dark:#3a3f49;--doc-bg-color-transparent-dark:rgba(24, 26, 30, 0);--doc-bg-color-alt-transparent-dark:rgba(58, 63, 73, 0);--fore-color-dark:#E0E4E8;--fore-color-alt-dark:#8898a7;--blockquote-bg-dark:rgba(224, 228, 232, 0.1);--tips-bg-color-dark:#3a3f49;--tips-bg-color-inset-dark:#E0E4E8;--a-color-dark:#FFFFFF;--mark-color-dark:rgba(0, 168, 190, 0.45);--tbl-border-color-dark:rgba(112, 116, 120, 0.8);--tbl-header-color-dark:#8a8e91;--tbl-th-bg-color-dark:rgba(112, 116, 120, 0.4);--tbl-td-bg-color-dark:rgba(112, 116, 120, 0.2);--tbl-cell-border-color-dark:rgba(112, 116, 120, 0.3);--tbl-row-g-alpha-dark:0.3;--del-color-dark:#a5b1bd;--toc-header-num-color-dark:rgba(224, 228, 232, 0.5);--header-color-dark:#00A8BE;--header-box-shadow-dark:rgba(0, 168, 190, 0.2);--header-bg-start-color-dark:rgba(0, 168, 190, 0);--header-bg-end-color-dark:rgba(0, 168, 190, 0.15);--code-bg-color-dark:#00454e;--code-name-bg-color-dark:#E0E4E8;--code-name-shadow-color-dark:rgba(255, 255, 255, 0.3);--acc-color-red-dark:#70141d;--acc-color-red-alt-dark:#9c1b29;--acc-color-red-fade-dark:rgba(199, 35, 52, 0.35);--acc-color-red-title-dark:#FFFFFF;--acc-color-yellow-dark:#7b6304;--acc-color-yellow-alt-dark:#947705;--acc-color-yellow-fade-dark:rgba(222, 179, 7, 0.35);--acc-color-yellow-title-dark:#FFFFFF;--acc-color-orange-dark:#804705;--acc-color-orange-alt-dark:#985406;--acc-color-orange-fade-dark:rgba(226, 125, 9, 0.35);--acc-color-orange-title-dark:#FFFFFF;--acc-color-green-dark:#1c5510;--acc-color-green-alt-dark:#2a8019;--acc-color-green-fade-dark:rgba(56, 171, 33, 0.35);--acc-color-green-title-dark:#FFFFFF;--acc-color-cyan-dark:#0d5864;--acc-color-cyan-alt-dark:#128092;--acc-color-cyan-fade-dark:rgba(24, 168, 191, 0.35);--acc-color-cyan-title-dark:#FFFFFF;--acc-color-blue-dark:#033e8c;--acc-color-blue-alt-dark:#0455be;--acc-color-blue-fade-dark:rgba(5, 107, 240, 0.35);--acc-color-blue-title-dark:#FFFFFF;--acc-color-purple-dark:#491a94;--acc-color-purple-alt-dark:#541eaa;--acc-color-purple-fade-dark:rgba(119, 56, 220, 0.35);--acc-color-purple-title-dark:#FFFFFF;--acc-color-pink-dark:#9a1e79;--acc-color-pink-alt-dark:#851968;--acc-color-pink-fade-dark:rgba(219, 67, 178, 0.35);--acc-color-pink-title-dark:#FFFFFF;--acc-color-brown-dark:#5d4227;--acc-color-brown-alt-dark:#6e4f2f;--acc-color-brown-fade-dark:rgba(164, 117, 70, 0.35);--acc-color-brown-title-dark:#FFFFFF;--acc-color-gray-dark:#494b4e;--acc-color-gray-alt-dark:#626468;--acc-color-gray-fade-dark:rgba(123, 125, 130, 0.35);--acc-color-gray-title-dark:#FFFFFF;--acc-color-theme1-dark:#007b8b;--acc-color-theme1-alt-dark:#007b8b;--acc-color-theme1-fade-dark:rgba(0, 123, 139, 0.3);--acc-color-theme1-title-dark:#FFFFFF;--acc-color-theme2-dark:#5f2aa4;--acc-color-theme2-alt-dark:#5f2aa4;--acc-color-theme2-fade-dark:rgba(95, 42, 164, 0.3);--acc-color-theme2-title-dark:#FFFFFF;--mm-color-red-dark:#f0acb3;--mm-color-red-alt-dark:#C72334;--mm-color-orange-dark:#fbd2a2;--mm-color-orange-alt-dark:#E27D09;--mm-color-yellow-dark:#fce99c;--mm-color-yellow-alt-dark:#DEB307;--mm-color-green-dark:#a3ea94;--mm-color-green-alt-dark:#38AB21;--mm-color-cyan-dark:#98e6f2;--mm-color-cyan-alt-dark:#18A8BF;--mm-color-blue-dark:#aacefd;--mm-color-blue-alt-dark:#056BF0;--mm-color-purple-dark:#dfd0f7;--mm-color-purple-alt-dark:#7738DC;--mm-color-pink-dark:#f8d9ef;--mm-color-pink-alt-dark:#DB43B2;--mm-color-brown-dark:#e2cebb;--mm-color-brown-alt-dark:#A47546;--mm-color-gray-dark:#d7d7d9;--mm-color-gray-alt-dark:#7B7D82;--cm-keyword-dark:#C88FD0;--cm-variable-dark:#E0E4E8;--cm-variable-2-dark:#9FBAD5;--cm-variable-3-dark:#1CC685;--cm-tag-dark:#7DF46A;--cm-attribute-dark:#7575E4;--cm-CodeMirror-cursor-dark:#8898a7;--cm-string-dark:#D26B6B;--cm-string-2-dark:#FF5500;--cm-comment-dark:#DA924A;--cm-header-dark:#8D8DF0;--cm-quote-dark:#57AC57;--cm-hr-dark:#D8D5D5;--cm-link-dark:#D3D3EF;--cm-negative-dark:#D95050;--cm-positive-dark:#50E650;--cm-meta-dark:#B7B3B3;--cm-buliddark:#F3B3F8;--cm-bracket-dark:#999977;--cm-atom-dark:#84B6CB;--cm-number-dark:#64AB8F;--vlook-invert-dark:var(--vlook-invert-dark-light);--vlook-brightness-dark:var(--vlook-brightness-dark-light);--doc-bg-color:var(--doc-bg-color-light);--doc-bg-color-alt:var(--doc-bg-color-alt-light);--doc-bg-color-transparent:var(--doc-bg-color-transparent-light);--doc-bg-color-alt-transparent:var(--doc-bg-color-alt-transparent-light);--fore-color:var(--fore-color-light);--fore-color-alt:var(--fore-color-alt-light);--blockquote-bg:var(--blockquote-bg-light);--tips-bg-color:var(--tips-bg-color-light);--tips-bg-color-inset:var(--tips-bg-color-inset-light);--a-color:var(--a-color-light);--mark-color:var(--mark-color-light);--tbl-border-color:var(--tbl-border-color-light);--tbl-header-color:var(--tbl-header-color-light);--tbl-th-bg-color:var(--tbl-th-bg-color-light);--tbl-td-bg-color:var(--tbl-td-bg-color-light);--tbl-cell-border-color:var(--tbl-cell-border-color-light);--tbl-row-g-alpha:var(--tbl-row-g-alpha-light);--del-color:var(--del-color-light);--toc-header-num-color:var(--toc-header-num-color-light);--header-color:var(--header-color-light);--header-box-shadow:var(--header-box-shadow-light);--header-bg-start-color:var(--header-bg-start-color-light);--header-bg-end-color:var(--header-bg-end-color-light);--code-bg-color:var(--code-bg-color-light);--code-name-bg-color:var(--code-name-bg-color-light);--code-name-shadow-color:var(--code-name-shadow-color-light);--acc-color-red:var(--acc-color-red-light);--acc-color-red-alt:var(--acc-color-red-alt-light);--acc-color-red-fade:var(--acc-color-red-fade-light);--acc-color-red-title:var(--acc-color-red-title-light);--acc-color-orange:var(--acc-color-orange-light);--acc-color-orange-alt:var(--acc-color-orange-alt-light);--acc-color-orange-fade:var(--acc-color-orange-fade-light);--acc-color-orange-title:var(--acc-color-orange-title-light);--acc-color-yellow:var(--acc-color-yellow-light);--acc-color-yellow-alt:var(--acc-color-yellow-alt-light);--acc-color-yellow-fade:var(--acc-color-yellow-fade-light);--acc-color-yellow-title:var(--acc-color-yellow-title-light);--acc-color-green:var(--acc-color-green-light);--acc-color-green-alt:var(--acc-color-green-alt-light);--acc-color-green-fade:var(--acc-color-green-fade-light);--acc-color-green-title:var(--acc-color-green-title-light);--acc-color-cyan:var(--acc-color-cyan-light);--acc-color-cyan-alt:var(--acc-color-cyan-alt-light);--acc-color-cyan-fade:var(--acc-color-cyan-fade-light);--acc-color-cyan-title:var(--acc-color-cyan-title-light);--acc-color-blue:var(--acc-color-blue-light);--acc-color-blue-alt:var(--acc-color-blue-alt-light);--acc-color-blue-fade:var(--acc-color-blue-fade-light);--acc-color-blue-title:var(--acc-color-blue-title-light);--acc-color-purple:var(--acc-color-purple-light);--acc-color-purple-alt:var(--acc-color-purple-alt-light);--acc-color-purple-fade:var(--acc-color-purple-fade-light);--acc-color-purple-title:var(--acc-color-purple-title-light);--acc-color-pink:var(--acc-color-pink-light);--acc-color-pink-alt:var(--acc-color-pink-alt-light);--acc-color-pink-fade:var(--acc-color-pink-fade-light);--acc-color-pink-title:var(--acc-color-pink-title-light);--acc-color-brown:var(--acc-color-brown-light);--acc-color-brown-alt:var(--acc-color-brown-alt-light);--acc-color-brown-fade:var(--acc-color-brown-fade-light);--acc-color-brown-title:var(--acc-color-brown-title-light);--acc-color-gray:var(--acc-color-gray-light);--acc-color-gray-alt:var(--acc-color-gray-alt-light);--acc-color-gray-fade:var(--acc-color-gray-fade-light);--acc-color-gray-title:var(--acc-color-gray-title-light);--acc-color-theme1:var(--acc-color-theme1-light);--acc-color-theme1-alt:var(--acc-color-theme1-alt-light);--acc-color-theme1-fade:var(--acc-color-theme1-fade-light);--acc-color-theme1-title:var(--acc-color-theme1-title-light);--acc-color-theme2:var(--acc-color-theme2-light);--acc-color-theme2-alt:var(--acc-color-theme2-alt-light);--acc-color-theme2-fade:var(--acc-color-theme2-fade-light);--acc-color-theme2-title:var(--acc-color-theme2-title-light);--mm-color-red:var(--mm-color-red-light);--mm-color-red-alt:var(--mm-color-red-alt-light);--mm-color-orange:var(--mm-color-orange-light);--mm-color-orange-alt:var(--mm-color-orange-alt-light);--mm-color-yellow:var(--mm-color-yellow-light);--mm-color-yellow-alt:var(--mm-color-yellow-alt-light);--mm-color-green:var(--mm-color-green-light);--mm-color-green-alt:var(--mm-color-green-alt-light);--mm-color-cyan:var(--mm-color-cyan-light);--mm-color-cyan-alt:var(--mm-color-cyan-alt-light);--mm-color-blue:var(--mm-color-blue-light);--mm-color-blue-alt:var(--mm-color-blue-alt-light);--mm-color-purple:var(--mm-color-purple-light);--mm-color-purple-alt:var(--mm-color-purple-alt-light);--mm-color-pink:var(--mm-color-pink-light);--mm-color-pink-alt:var(--mm-color-pink-alt-light);--mm-color-brown:var(--mm-color-brown-light);--mm-color-brown-alt:var(--mm-color-brown-alt-light);--mm-color-gray:var(--mm-color-gray-light);--mm-color-gray-alt:var(--mm-color-gray-alt-light);--cm-keyword:var(--cm-keyword-light);--cm-variable:var(--cm-variable-light);--cm-variable-2:var(--cm-variable-2-light);--cm-variable-3:var(--cm-variable-3-light);--cm-tag:var(--cm-tag-light);--cm-attribute:var(--cm-attribute-light);--cm-CodeMirror-cursor:var(--cm-CodeMirror-cursor-light);--cm-string:var(--cm-string-light);--cm-string-2:var(--cm-string-2-light);--cm-comment:var(--cm-comment-light);--cm-header:var(--cm-header-light);--cm-quote:var(--cm-quote-light);--cm-hr:var(--cm-hr-light);--cm-link:var(--cm-link-light);--cm-negative:var(--cm-negative-light);--cm-positive:var(--cm-positive-light);--cm-meta:var(--cm-meta-light);--cm-bulidin:var(--cm-bulidin-light);--cm-bracket:var(--cm-bracket-light);--cm-atom:var(--cm-atom-light);--cm-number:var(--cm-number-light)}html{font-size:1em}::selection{background:rgba(119,53,204,.3)}body.typora-export #write{filter:grayscale(50%) opacity(.4)}.mdx-vlook-load-done{filter:none!important;display:block!important}body{background-color:var(--doc-bg-color);color:var(--fore-color);font-family:"VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif;font-weight:400;line-height:2;-webkit-tap-highlight-color:transparent}body.typora-export{padding-left:0;padding-right:0}body>:first-child{margin-top:0!important}body>:last-child{margin-bottom:0!important}body.freeze{overflow:hidden}body.unfreeze{overflow:auto}.md-img-error>.md-meta{background-color:var(--mark-color);color:var(--fore-color);border:5px dotted var(--doc-bg-color);border-radius:var(--vlook-base-radius);padding:10px}.md-img-error[data-src$=".m4a"]>.md-meta,.md-img-error[data-src$=".mp3"]>.md-meta,.md-img-error[data-src$=".mp4"]>.md-meta,.md-img-error[data-src$=".ogg"]>.md-meta,.md-img-error[data-src$=".ogv"]>.md-meta,.md-img-error[data-src$=".wav"]>.md-meta,.md-img-error[data-src$=".webm"]>.md-meta,.md-img-error[data-src*=".m4a?"]>.md-meta,.md-img-error[data-src*=".mp3?"]>.md-meta,.md-img-error[data-src*=".mp4"]>.md-meta,.md-img-error[data-src*=".ogg?"]>.md-meta,.md-img-error[data-src*=".ogv"]>.md-meta,.md-img-error[data-src*=".wav?"]>.md-meta,.md-img-error[data-src*=".webm"]>.md-meta{background:0 0;color:var(--header-color);border:inherit;padding:inherit;border-radius:inherit}.md-diagram-panel svg,.mdx-figure,img[src*="mode=figure"],p>.md-image:only-child:not(.md-img-error) img,p>img:only-child,svg[data-inject-url*="mode=figure"]{background-color:var(--doc-bg-color);border-radius:var(--vlook-base-radius);padding:0;border:2px solid var(--doc-bg-color-alt)}.mdx-mermaid-restyler{padding-bottom:0!important;margin-top:0!important;margin-bottom:-10px!important}img[src*="mode=figure"],p>.md-image:only-child:not(.md-img-error) img,p>.md-image:only-child:not(.md-img-error) img[src*="align=left"],p>.md-image:only-child:not(.md-img-error) svg[data-inject-url*="align=left"],p>img:only-child,p>img:only-child[src*="align=left"],p>svg[data-inject-url*="align=left"],svg[data-inject-url*="mode=figure"]{margin:0!important}p>.md-image:only-child:not(.md-img-error) img[src*="align=center"],p>.md-image:only-child:not(.md-img-error) svg[data-inject-url*="align=center"]{margin:auto!important}p>.md-image:only-child:not(.md-img-error) img[src*="align=right"],p>.md-image:only-child:not(.md-img-error) svg[data-inject-url*="align=right"]{margin:auto 0 auto auto!important}img[src*="padding=true"],svg[data-inject-url*="padding=true"]{padding:20px!important}img[src*="inline=true"],svg[data-inject-url*="inline=true"]{margin-bottom:20px!important}img[src*="grid=line"],svg[data-inject-url*="grid=line"]{background:url()}img[src*="grid=block"],svg[data-inject-url*="grid=block"]{background:url()}img[data-vk-img-fill=text],img[data-vk-img-fill=theme1],img[data-vk-img-fill=theme2]{left:-12345px;border-color:transparent;position:relative}img[src*="mode=icon"],svg[data-inject-url*="mode=icon"]{display:inline!important;height:1.25em;width:auto;margin-top:-4px!important;vertical-align:middle;border:0!important;border-radius:0!important;background:0 0!important}img[src*="mode=icon2x"],svg[data-inject-url*="mode=icon2x"]{height:2em}img[src*="mode=logo"],svg[data-inject-url*="mode=logo"]{display:inline!important;vertical-align:middle;border:0!important;border-radius:0!important;background:0 0!important}img[src*="mode=logol"],svg[data-inject-url*="mode=logol"]{float:left!important;padding:0 20px 0 0}img[src*="mode=logor"],svg[data-inject-url*="mode=logor"]{float:right!important;padding:0 0 0 20px}img[src*="mode=frame"],svg[data-inject-url*="mode=frame"]{display:inline!important;vertical-align:middle;border:2px solid var(--doc-bg-color-alt)!important;border-radius:var(--vlook-base-radius)!important;background:0 0!important;margin-bottom:20px!important}img[src*="mode=framel"],svg[data-inject-url*="mode=framel"]{float:left!important;padding:0 20px 0 0}img[src*="mode=framer"],svg[data-inject-url*="mode=framer"]{float:right!important;padding:0 0 0 20px}.md-header-anchor{margin:0!important;vertical-align:top!important}.md-emoji-span:before{vertical-align:baseline}audio{margin:0 10px;border-radius:var(--vlook-small-radius)}a{color:var(--a-color)!important;border-bottom:2px solid #7735cc;font-family:"VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif;font-weight:400;text-decoration:none}a[href*="lnkcss=none"],kbd a{border-bottom:none}kbd a{color:var(--doc-bg-color)!important}a kbd{color:#fff!important;font-family:"VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif!important;background-color:#00a8be!important;margin:5px 0;border-radius:var(--vlook-base-radius);display:inline-block;box-shadow:0 2px 10px rgba(0,0,0,.3),0 0 0 0 transparent;padding:5px 10px}blockquote a kbd{padding:2px 8px}h1 a,h2 a,h3 a,h4 a,h5 a,h6 a{color:#00a8be!important;font-weight:inherit}a[href*="lnkcss=none"]:hover,kbd a:hover{color:#7735cc!important;box-shadow:none;border-bottom:none}.mdx-quote-blue a kbd:hover,.mdx-quote-brown a kbd:hover,.mdx-quote-cyan a kbd:hover,.mdx-quote-gray a kbd:hover,.mdx-quote-green a kbd:hover,.mdx-quote-orange a kbd:hover,.mdx-quote-pink a kbd:hover,.mdx-quote-purple a kbd:hover,.mdx-quote-red a kbd:hover,.mdx-quote-theme1 a kbd:hover,.mdx-quote-theme2 a kbd:hover,.mdx-quote-yellow a kbd:hover,a kbd:hover{color:#00dad8!important;background-color:#7735cc!important}a:hover{color:#7735cc!important;box-shadow:0 -.3em 0 0 rgba(119,53,204,.3) inset}a:hover img{filter:var(--vlook-invert-dark) brightness(1.1)}a:hover img[data-vk-img-fill=text],a:hover img[data-vk-img-fill=theme1],a:hover img[data-vk-img-fill=theme2]{left:-12345px;filter:drop-shadow(12345px 0 #7735cc)!important;position:relative}a:active img{filter:brightness(.8)}a:active,blockquote a kbd{border-radius:var(--vlook-small-radius)}a:active{color:var(--fore-color)!important;background-color:var(--doc-bg-color-alt);border-bottom:0;box-shadow:0 0 0 2px rgba(119,53,204,.5);transition:none}a kbd,a[href*="lnkcss=none"]:active,kbd a:active{border:0}a kbd:active{background-color:#7c5ba6!important;box-shadow:0 0 0 2px rgba(124,91,166,.5);transition:none}a:not([name^=ref-footnote]):hover::before{content:"URL";white-space:pre;margin-top:-8px;vertical-align:super;line-height:1;color:#fff;border-radius:var(--vlook-tag-radius);padding:2px 3px;font-size:.5em;font-weight:900;background-color:#7735cc;position:absolute;z-index:99999}table td a:not([name^=ref-footnote]):hover::before,table th a:not([name^=ref-footnote]):hover::before{margin-top:-14px}a[class*=md-toc-inner]:hover::before,a[href^="#"]:hover::before{content:"#";background-color:#7b7d82}a[href^="http://"]:hover::before{content:"HTTP";background-color:#a47546}a[href^="https://"]:hover::before{content:"Secure HTTP";background-color:#38ab21}a[href^="mailto:"]:hover::before{content:"Email";background-color:#056bf0}a[href^="ftp://"]:hover::before{content:"FTP";background-color:#a47546}a[href^="ftps://"]:hover::before{content:"Secure FTP";background-color:#38ab21}a[href^="file://"]:hover::before{content:"Local File";background-color:#a47546}a[href^="smb://"]:hover::before{content:"SMB";background-color:#7738dc}a[href$=".csv"]:hover::before,a[href$=".doc"]:hover::before,a[href$=".docx"]:hover::before,a[href$=".pdf"]:hover::before,a[href$=".ppt"]:hover::before,a[href$=".pptx"]:hover::before,a[href$=".txt"]:hover::before,a[href$=".xls"]:hover::before,a[href$=".xlsx"]:hover::before{content:"Document";background-color:#18a8bf}a[href$=".7z"]:hover::before,a[href$=".cab"]:hover::before,a[href$=".dmg"]:hover::before,a[href$=".gz"]:hover::before,a[href$=".rar"]:hover::before,a[href$=".tar"]:hover::before,a[href$=".zip"]:hover::before{content:"Archive File";background-color:#e27d09}a[href$=".exe"]:hover::before,a[href$=".sh"]:hover::before{content:"!! High Risk !!";background-color:#c72334}u{text-decoration:none;border-bottom:1px solid var(--fore-color)}h1,h2,h3,h4,h5{font-family:"VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif;font-weight:900}h5{margin:1em 0 .5em}h1,h2,h3,h4,h5,h6{color:var(--header-color);position:relative;padding:10px;line-height:1.5;border-radius:var(--vlook-base-radius) var(--vlook-base-radius) 0 0;background:linear-gradient(0deg,var(--header-bg-start-color),var(--header-bg-end-color))}blockquote p+ol,blockquote p+ul,blockquote>ol,blockquote>ul,h1+figure,h1+ol,h1+ul,h2+figure,h2+ol,h2+ul,h3+figure,h3+ol,h3+ul,h4+figure,h4+ol,h4+ul,h5+figure,h5+ol,h5+ul,h6+figure,h6+ol,h6+ul,li>figure,li>p+ol,li>p+ul{margin-top:0}h1,h2{margin:3em 0 .5em;font-size:2em;box-shadow:0 7px 0 0 var(--header-box-shadow) inset;counter-reset:h2}h2{font-size:1.8em;box-shadow:0 5px 0 0 var(--header-box-shadow) inset;counter-reset:h3}h1+h2,h2+h3,h3+h4,h4+h5{box-shadow:none;background:0 0;margin-top:-.5em}h3,h4{margin:2em 0 .5em;font-size:1.6em;box-shadow:0 3px 0 0 var(--header-box-shadow) inset;counter-reset:h4}h4{font-size:1.4em;box-shadow:0 1px 0 0 var(--header-box-shadow) inset;counter-reset:h5}h5,h6{font-size:1.25em}h5{box-shadow:0 0 0 0 var(--header-box-shadow) inset}h6{margin:1em 0 0;padding-top:.5em;padding-bottom:.5em;font-family:"VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif;font-weight:900;box-shadow:none;background:0 0}h6::after{content:"";display:block;width:3.5em;margin-left:1.25em;padding-bottom:4px;border-bottom:2px solid rgba(0,218,216,.5)}#write>h6:first-child::after,#write>h6:last-child::after,#write>pre.md-meta-block:first-child+h6::after,blockquote h6::after{margin-left:0;padding-bottom:0;border:0}h1+h6,h2+h6,h3+h6,h4+h6,h5+h6,h6+h6{margin-top:0;padding-top:0}li>h6{color:var(--header-color);border-left:0;padding-left:0}li>h6::before{content:"▪ ";color:rgba(0,218,216,.5)}strong{font-family:"VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif}strong,strong a{font-weight:900}hr{margin-top:1.5em;margin-bottom:1.5em;border:2px solid var(--doc-bg-color-alt);overflow:hidden;box-sizing:content-box;border-top:0}body>div>h1:first-of-type{border-top:0}a:first-child>h1,a:first-child>h2,a:first-child>h3,a:first-child>h4,a:first-child>h5,a:first-child>h6,body>h1:first-child,body>h1:first-child+h2,body>h2:first-child,body>h3:first-child,body>h4:first-child,body>h5:first-child,body>h6:first-child{margin-top:0;padding-top:0}.md-diagram-panel,figure,ol>li,p,ul>li{text-align:left;margin-top:0}figure{padding-bottom:1px;margin-bottom:20px;border-radius:var(--vlook-base-radius)}::marker,li::before{font-family:"VLOOK Number","Altinn-DIN","Bebas Neue","DIN","VLOOK Sans Mono","Noto Sans Mono",Iosevka,"SF Mono",Menlo,"Cascadia Mono",Consolas,Courier,"Courier New","VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif;color:var(--fore-color-alt)}ol,ul{padding-left:1.25em;padding-bottom:0}ol>li{list-style-type:decimal}ol>li>ol>li{list-style-type:lower-alpha}ol>li>ol>li>ol>li{list-style-type:lower-roman}ol>li>ol>li>ol>li>ol>li{list-style-type:decimal-leading-zero}ol>li>ol>li>ol>li>ol>li>ol>li{list-style-type:upper-alpha}ol>li>ol>li>ol>li>ol>li>ol>li>ol>li{list-style-type:upper-roman}ul>li{list-style-type:disc}ul>li>ul>li{list-style-type:square}ul>li>ul>li>ul>li{list-style-type:circle}blockquote{border-radius:var(--vlook-base-radius);padding:.5em 1em;margin-top:0;margin-bottom:1em;color:var(--fore-color);background-color:var(--blockquote-bg)}.md-hr+blockquote,.md-hr+blockquote+blockquote,hr+blockquote,hr+blockquote+blockquote{display:inline-block!important;max-width:49%!important;min-width:49%!important;vertical-align:top}.md-hr+blockquote+blockquote,hr+blockquote+blockquote{margin-left:2%!important}.md-hr+.md-hr+blockquote,.md-hr+.md-hr+blockquote+blockquote,.md-hr+.md-hr+blockquote+blockquote+blockquote,hr+hr+blockquote,hr+hr+blockquote+blockquote,hr+hr+blockquote+blockquote+blockquote{display:inline-block!important;max-width:32%!important;min-width:32%!important;vertical-align:top}.md-hr+.md-hr+blockquote+blockquote,.md-hr+.md-hr+blockquote+blockquote+blockquote,hr+hr+blockquote+blockquote,hr+hr+blockquote+blockquote+blockquote{margin-left:2%!important}.md-hr+.md-hr+.md-hr+blockquote,.md-hr+.md-hr+.md-hr+blockquote+blockquote,.md-hr+.md-hr+.md-hr+blockquote+blockquote+blockquote,.md-hr+.md-hr+.md-hr+blockquote+blockquote+blockquote+blockquote,hr+hr+hr+blockquote,hr+hr+hr+blockquote+blockquote,hr+hr+hr+blockquote+blockquote+blockquote,hr+hr+hr+blockquote+blockquote+blockquote+blockquote{display:inline-block!important;max-width:23.5%!important;min-width:23.5%!important;vertical-align:top}.md-hr+.md-hr+.md-hr+blockquote+blockquote,.md-hr+.md-hr+.md-hr+blockquote+blockquote+blockquote,.md-hr+.md-hr+.md-hr+blockquote+blockquote+blockquote+blockquote,hr+hr+hr+blockquote+blockquote,hr+hr+hr+blockquote+blockquote+blockquote,hr+hr+hr+blockquote+blockquote+blockquote+blockquote{margin-left:2%!important}.md-hr+.md-hr,hr+hr,p+ol,p+ul{margin-top:-1em}blockquote>p{margin-bottom:0}blockquote hr{border-color:var(--doc-bg-color);margin-top:10px;margin-bottom:10px}blockquote h6{padding:5px 0;color:var(--fore-color);font-size:1.25em}blockquote h6 a{margin-left:-.1em}blockquote h6::before{content:""!important;margin-left:0!important}h6+blockquote,li>blockquote{width:fit-content!important}blockquote>blockquote{border-left:5px solid rgba(123,125,130,.2);background:0 0;border-radius:0;padding-top:0;padding-bottom:0}blockquote>strong{color:inherit!important}.mdx-img-lost,.mdx-link-error-list{background-color:var(--doc-bg-color-alt)}.mdx-img-lost{background-image:url()!important;background-size:400px 200px;border:0;width:400px;height:200px}.mdx-link-error-list{display:none;padding:10px 0;position:fixed;color:var(--fore-color);top:20px;right:20px;bottom:50px;width:var(--vlook-nav-center-width);line-height:1.5;border-radius:var(--vlook-base-radius);overflow:auto;z-index:4500}.mdx-link-error-list-header{display:none;position:absolute;z-index:10;border-radius:var(--vlook-base-radius) var(--vlook-base-radius) 0 0;top:0;left:0;height:30px;width:100%;background:linear-gradient(180deg,var(--doc-bg-color-alt) 10px,var(--doc-bg-color-alt-transparent));pointer-events:none}.mdx-link-error-list-body{padding:10px 0;height:100%;z-index:0}.mdx-link-error-list-items{overflow-y:scroll;height:100%;z-index:0}.mdx-link-error-list-footer{position:absolute;z-index:10;border-radius:0 0 var(--vlook-base-radius) var(--vlook-base-radius);top:auto;left:0;bottom:0;height:30px;width:100%;background:linear-gradient(0deg,var(--doc-bg-color-alt) 10px,var(--doc-bg-color-alt-transparent));pointer-events:none}.mdx-doc-info,.mdx-link-chk-result,.mdx-status-bar{justify-content:center;align-items:center;height:30px}.mdx-status-bar{position:fixed;border-radius:var(--vlook-small-radius);right:30px;bottom:20px;z-index:100}.mdx-doc-info,.mdx-link-chk-result{vertical-align:top;color:var(--fore-color);background-color:var(--doc-bg-color-alt)}.mdx-doc-info{display:inline-flex;font-family:"VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif;font-size:.85em;padding:0 10px;min-width:80px;border-radius:var(--vlook-small-radius);opacity:.6;cursor:default}.mdx-link-chk-result{display:none;cursor:pointer;padding:0;width:30px;border-radius:0 var(--vlook-small-radius) var(--vlook-small-radius) 0}.mdx-link-result-ok{display:flex;background-color:var(--acc-color-green-light)}.mdx-link-result-error{display:inline-flex;cursor:pointer;background-color:var(--acc-color-red-light)}.mdx-link-result-error:hover{background-color:var(--fore-color)}.mdx-link-result-error:hover>svg>use{fill:var(--doc-bg-color)}.mdx-link-result-error:active{background-color:var(--acc-color-red-light);box-shadow:0 0 0 2px rgba(199,35,52,.5)}.mdx-link-result-error:active>svg>use,use.mdx-svg-ico-light{fill:#fff}.mdx-link-error-source:focus{outline:2px dashed var(--acc-color-red-light)}table{border-collapse:inherit;border-spacing:0;width:auto;line-height:1.5;word-break:break-all;white-space:pre-wrap;border:2px solid var(--tbl-border-color);border-radius:var(--vlook-base-radius);background-color:var(--doc-bg-color)}thead{display:contents!important}table>thead>tr>td,table>thead>tr>th{background-color:var(--tbl-th-bg-color);font-family:"VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif;font-weight:900;border-right:1px solid var(--tbl-cell-border-color);margin:0;padding:.5em;box-shadow:0 1px 0 var(--tbl-cell-border-color)}table>tbody>tr:first-child>td{box-shadow:0 -2px 0 0 var(--tbl-header-color)}table>tbody>tr:not(:first-child)>td{box-shadow:0 -1px 0 0 var(--tbl-cell-border-color)}table>tbody>tr:nth-child(2n){background-color:var(--tbl-td-bg-color)}table>thead>tr:first-child>th:first-child{border-top-left-radius:var(--vlook-table-radius);white-space:pre}table td,table th{font-size:.9em}table>thead>tr:first-child>th:last-child{border-top-right-radius:var(--vlook-table-radius)}table>tbody>tr:last-child>td:first-child{border-bottom-left-radius:var(--vlook-table-radius)}table>tbody>tr:last-child>td:last-child{border-bottom-right-radius:var(--vlook-table-radius)}table tr>td{border-right:1px solid var(--tbl-cell-border-color);margin:0;padding:5px;vertical-align:top}table tr>td:first-child,table tr>th{white-space:pre!important}table tr>td:last-child,table tr>th:last-child{border-right:0}.mdx-empty-cell{padding:1px;background-color:var(--tbl-header-color)}table>tbody>tr:not(:first-child)>td.mdx-empty-cell{box-shadow:none!important}.mdx-th-repeater{font-family:"VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif;font-weight:900;background-color:var(--tbl-th-bg-color);vertical-align:middle!important}.mdx-th-repeater.first{box-shadow:0 -2px 0 0 var(--tbl-header-color),0 1px 0 0 var(--tbl-header-color)!important}.mdx-th-repeater.not-first{box-shadow:0 1px 0 0 var(--tbl-header-color)!important}.mdx-table-colspan-all{padding-left:5px;background-color:var(--tbl-th-bg-color)}.mdx-table-colspan-all::before{content:""}.mdx-tbl-col-fmt-bold{font-family:"VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif;font-weight:900}.mdx-tbl-col-fmt-em{font-style:italic}.mdx-tbl-col-fmt-mark{background-color:var(--mark-color)!important;text-shadow:0 1px 0 var(--doc-bg-color);color:var(--fore-bg-color)!important}.mdx-tbl-col-fmt-num{font-family:"VLOOK Number","Altinn-DIN","Bebas Neue","DIN","VLOOK Sans Mono","Noto Sans Mono",Iosevka,"SF Mono",Menlo,"Cascadia Mono",Consolas,Courier,"Courier New","VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif!important}.mdx-tbl-col-fmt-num-positive{color:#d00000}.mdx-tbl-col-fmt-num-negative{color:#00b000}.mdx-tbl-col-fmt-num-decimal{font-size:.8em}.mdx-tbl-col-fmt-currency{float:left;font-size:.9em;padding-right:10px;color:var(--fore-color-alt);font-weight:400}.mdx-tbl-col-fmt-percent{opacity:.6;font-size:.8em}.mdx-tbl-row-g-folder{text-align:left!important}h6+figure table tbody>tr>td.mdx-tbl-row-g-not-folder,li>figure table tbody>tr>td.mdx-tbl-row-g-not-folder{text-align:left!important;padding-left:50px!important}td.mdx-tbl-row-g-not-folder{text-align:left!important;padding-left:25px!important}.mdx-tbl-row-g-btn{cursor:pointer}.mdx-blockquote-folder.hover>svg>use,.mdx-tbl-row-g-btn.hover>svg>use{fill:#7735cc!important}.mdx-blockquote-folder.hover:active>svg>use,.mdx-tbl-row-g-btn.hover:active>svg>use{fill:#7c5ba6!important}.mdx-tbl-row-g-sub{text-align:left!important;padding-left:5px!important}.mdx-tbl-row-g-identer{width:4px;height:32px;display:inline-block;padding:0;margin:-10px 58px -10px 4px}h6+figure table .mdx-tbl-row-g-identer,li>figure table .mdx-tbl-row-g-identer{margin-right:82px}.mdx-tbl-row-g-identer+.mdx-tbl-row-g-identer{margin-left:-12px!important}h6+figure table .mdx-tbl-row-g-identer+.mdx-tbl-row-g-identer,li>figure table .mdx-tbl-row-g-identer+.mdx-tbl-row-g-identer{margin-right:52px!important}.mdx-tbl-row-g-identer-folder{margin-right:38px}h6+figure table .mdx-tbl-row-g-identer-folder,li>figure table .mdx-tbl-row-g-identer-folder{margin-right:62px!important}h6+figure table .mdx-tbl-row-g-identer+.mdx-tbl-row-g-identer-folder,li>figure table .mdx-tbl-row-g-identer+.mdx-tbl-row-g-identer-folder{margin-right:30px!important}h6+figure table,li>figure table{counter-reset:tableRowNumber - 1}h6+figure table tbody tr,li>figure table tbody tr{counter-increment:tableRowNumber}figure table tr::before{content:"";color:var(--toc-header-num-color);font-family:"VLOOK Number","Altinn-DIN","Bebas Neue","DIN","VLOOK Sans Mono","Noto Sans Mono",Iosevka,"SF Mono",Menlo,"Cascadia Mono",Consolas,Courier,"Courier New","VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif;font-weight:400!important;font-style:normal!important;font-size:.8em;vertical-align:middle;text-align:right;width:2.5em;position:absolute;left:1em;padding-top:5px}h6+figure table tbody tr::before,li>figure table tbody tr::before{content:counter(tableRowNumber);text-align:right;margin-top:4px;margin-left:-15px;font-size:.6em;color:var(--fore-color-alt);position:absolute}h6+figure table tbody tr:hover::before,li>figure table tbody tr:hover::before{content:"▶";color:#7735cc}.mdx-tbl-row-num-hidden::before{content:""!important}h6+figure table tbody tr::before{margin-left:5px}h6+figure table tr>td:first-child,h6+figure table tr>th:first-child,li>figure table tr>td:first-child,li>figure table tr>th:first-child{padding-left:30px}.mdx-table-cross{top:0;width:100px;height:100px;position:absolute;visibility:hidden;opacity:0;pointer-events:none}.mdx-table-cross.left{background:linear-gradient(90deg,rgba(119,53,204,.01),rgba(119,53,204,.3))}.mdx-table-cross.right{background:linear-gradient(90deg,rgba(119,53,204,.3),rgba(119,53,204,.01))}.mdx-table-cross.up{background:linear-gradient(0deg,rgba(119,53,204,.3),rgba(119,53,204,.01))}.mdx-table-cross.down{background:linear-gradient(0deg,rgba(119,53,204,.01),rgba(119,53,204,.3))}mark{box-shadow:0 -.9em 0 0 var(--mark-color) inset;text-shadow:0 1px 0 var(--doc-bg-color);background:0 0;margin-left:.1em;margin-right:.1em;color:inherit}del,del strong{color:var(--del-color)!important;text-decoration:line-through solid!important}del code{font-style:italic;text-decoration:line-throug solid!important}.footnotes-area{margin-top:100px}.footnote-line{font-size:1em;margin-top:.5em;padding-bottom:.5em}.mdx-foot-note-panel-content>.footnote-line{padding-bottom:50px}.md-fn-count,a[name^=ref-footnote-]{font-family:"VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif;font-weight:400}.md-fn-count::before{content:"["}.md-fn-count::after{content:"] "}.reversefootnote{color:#056bf0}.reversefootnote:hover{color:#c72334}a[name^=ref-footnote-]{color:#056bf0}a[name^=ref-footnote-]:hover{color:#7c5ba6}.CodeMirror-gutters{border-width:0;background-color:var(--doc-bg-color-alt);border-right:1px solid var(--doc-bg-color-alt);height:100%!important}.CodeMirror-linenumber{color:#737c8f;font-family:"VLOOK Number","Altinn-DIN","Bebas Neue","DIN","VLOOK Sans Mono","Noto Sans Mono",Iosevka,"SF Mono",Menlo,"Cascadia Mono",Consolas,Courier,"Courier New","VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif}#write>pre.md-meta-block,.md-fences,code,tt{font-family:"VLOOK Sans Mono","Noto Sans Mono",Iosevka,"SF Mono",Menlo,"Cascadia Mono",Consolas,Courier,"Courier New","VLOOK Sans Mono","Noto Sans Mono",Iosevka,"SF Mono",Menlo,"Cascadia Mono",Consolas,Courier,"Courier New","VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","VLOOK Sans Mono","Noto Sans Mono",Iosevka,"SF Mono",Menlo,"Cascadia Mono",Consolas,Courier,"Courier New","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",monospace;color:var(--fore-color)}code,tt{font-weight:400;background-color:var(--code-bg-color);border-radius:var(--vlook-small-radius);padding:2px 5px;box-shadow:0 0 0 1px var(--doc-bg-color) inset;font-size:.9em;display:inline;white-space:pre}#write>pre.md-meta-block,.md-fences{border-radius:var(--vlook-base-radius)}.md-fences{border:2px solid var(--tbl-border-color);margin:0 0 20px}.mdx-caption>.md-fences,code,tt{margin:0}.task-list{padding-left:0}.task-list-item{padding-left:32px}.task-list-item input{top:3px;left:8px}#write>pre.md-meta-block{font-weight:400;font-size:1em;line-height:2;padding:4px 10px;background-color:var(--code-bg-color)}.mathjax-block>.code-tooltip{bottom:.375em}.md-tag{color:inherit}#typora-quick-open{border:1px solid var(--tbl-border-color);background-color:rgba(24,26,30,.05)}#typora-quick-open-item{background-color:rgba(24,26,30,.05);border-color:var(--tbl-border-color);border-style:solid;border-width:1px}#md-notification::before{top:10px}.on-focus-mode blockquote{border-left-color:#181a1e}.md-toc-content{counter-reset:h1toc}.md-toc-h1,.md-toc-h2{margin-left:0;padding-left:10px;counter-reset:h2toc}.md-toc-h2{padding-left:20px;counter-reset:h3toc}.md-toc-h3,.md-toc-h4{margin-left:0;padding-left:30px;counter-reset:h4toc}.md-toc-h4{padding-left:40px;counter-reset:h5toc}.md-toc-h5,.md-toc-h6{margin-left:0;padding-left:50px}.md-toc-h5{counter-reset:h6toc}.md-toc-h6{display:none}.md-toc-h1::before{counter-increment:h1toc;content:counter(h1toc) ".  "}.md-toc-h1>.md-toc-inner{margin-left:0;font-weight:900}.md-toc-h2::before{counter-increment:h2toc;content:counter(h1toc) "." counter(h2toc) "  "}.md-toc-h2>.md-toc-inner,.md-toc-h3>.md-toc-inner,.md-toc-h4>.md-toc-inner,.md-toc-h5>.md-toc-inner{margin-left:0}.md-toc-h3::before{counter-increment:h3toc;content:counter(h1toc) "." counter(h2toc) "." counter(h3toc) "  "}.md-toc-h4::before{counter-increment:h4toc;content:counter(h1toc) "." counter(h2toc) "." counter(h3toc) "." counter(h4toc) "  "}.md-toc-h5::before{counter-increment:h5toc;content:counter(h1toc) "." counter(h2toc) "." counter(h3toc) "." counter(h4toc) "." counter(h5toc) "  "}#write{counter-reset:h1}#write h1::before,#write h2::before,#write h3::before,#write h4::before,#write h5::before,#write h6::before{color:rgba(0,218,216,.5)}#write h1::before{counter-increment:h1;content:counter(h1) ".  "}#write h2::before{counter-increment:h2;content:counter(h1) "." counter(h2) "  "}#write h3::before{counter-increment:h3;content:counter(h1) "." counter(h2) "." counter(h3) "  "}#write h4::before{counter-increment:h4;content:counter(h1) "." counter(h2) "." counter(h3) "." counter(h4) "  "}#write h5::before{counter-increment:h5;content:counter(h1) "." counter(h2) "." counter(h3) "." counter(h4) "." counter(h5) "  "}#write h6::before{content:"❖ "}#write>h6:first-child::before,#write>h6:last-child::before,#write>pre.md-meta-block:first-child+h6::before{content:""}#write>h3.md-focus::before,#write>h4.md-focus::before,#write>h5.md-focus::before,#write>h6.md-focus::before,h3.md-focus::before,h4.md-focus::before,h5.md-focus::before,h6.md-focus::before{border:inherit;position:inherit;left:inherit;float:none;top:initial;font-size:inherit;vertical-align:inherit;font-weight:inherit;line-height:inherit}.outline-item{line-height:1;font-family:"VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif;font-weight:400}.pieTitleText{font-family:"VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif!important;font-size:1.5em!important}.legend text,.pieTitleText{fill:var(--fore-color)!important}.legend text,.pieTitleText,.slice{font-weight:900!important}.mdx-figure .label div,.mermaid .label div{font-size:.9em!important}#INIT .label div,g[id^=flowchart-INIT] .label div,svg[id^=mermaidChart]{color:var(--fore-color)!important}.cluster text,.label div,.legend text,.slice,text.actor,text.actor>tspan{font-family:"VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif!important}.label div{color:var(--fore-color)!important;font-weight:400!important}.node polygon,.node rect[rx="0"][ry="0"],.node rect[rx="5"][ry="5"]{fill:var(--mm-color-blue-alt)!important;stroke:var(--mm-color-blue)!important;stroke-width:5px!important}.node polygon,.node rect[rx="5"][ry="5"]{stroke-width:1px!important}.node circle,.node[id^=flowchart-page] polygon,.node[id^=page] polygon{fill:var(--doc-bg-color)!important;stroke:var(--mm-color-green)!important;stroke-width:2px!important}.node polygon{fill:var(--mm-color-red-alt)!important;stroke:var(--mm-color-red)!important}.node[id^=flowchart-trans] polygon,.node[id^=trans] polygon{fill:var(--fore-color)!important;stroke-width:0!important}.edgePath .path{stroke:var(--fore-color)!important;stroke-width:2px}.arrowheadPath,.mdx-segment-btn.hover>svg>use,.mdx-segment-indicator>svg>use,use.mdx-svg-ico-dark{fill:var(--fore-color)}.edgeLabel,.edgeLabel .label span{color:var(--fore-color)!important;line-height:1em!important}.edgeLabel,.edgeLabel .label rect,.edgeLabel .label span,.edgeLabel div,g.stateGroup .composit{fill:var(--doc-bg-color)!important}.actor,.cluster rect{stroke-width:1px!important}.cluster rect{fill:var(--doc-bg-color-alt)!important;stroke:var(--fore-color)!important;stroke-dasharray:3px!important}.cluster text,text.actor,text.actor>tspan{fill:var(--fore-color)!important}.cluster text{color:var(--fore-color)!important;font-weight:400!important}#END rect,#INIT circle,#START rect,g[id^=flowchart-END] rect,g[id^=flowchart-INIT] circle,g[id^=flowchart-START] rect{fill:var(--fore-color)!important;stroke:var(--fore-color)!important;stroke-width:5px!important}#START rect+.label div,g[id^=flowchart-START] rect+.label div{color:var(--doc-bg-color)!important;font-weight:900!important}#END rect,g[id^=flowchart-END] rect{color:var(--fore-color)!important;fill:var(--doc-bg-color)!important}#END rect+.label div,g[id^=flowchart-END] rect+.label div{font-weight:900!important}#INIT circle,g[id^=flowchart-INIT] circle{stroke-width:0!important}#INIT~g>rect,g[id^=flowchart-INIT]~g>rect[rx="0"][ry="0"],g[id^=flowchart-INIT]~g>rect[rx="5"][ry="5"],g[id^=flowchart-INIT]~g>rect[rx][ry]{fill:var(--mm-color-purple-alt)!important;stroke:var(--mm-color-purple)!important;stroke-width:3px!important}#FINAL circle,g[id^=flowchart-FINAL] circle{fill:none!important;stroke:var(--fore-color)!important;stroke-width:5px!important}.actor{stroke:var(--mm-color-blue)!important;fill:var(--mm-color-blue-alt)!important;font-size:1em!important}.mdx-actor-person{fill:var(--doc-bg-color-alt)!important;stroke:var(--fore-color-alt)!important}.mdx-actor-key-sys{stroke-width:3px!important;font-weight:900!important}.mdx-actor-ext-sys{stroke-dasharray:5px,2px!important;font-style:italic!important}text.actor,text.actor>tspan{stroke:none!important;font-size:.9em!important}.actor-line{stroke:var(--mm-color-blue)!important;stroke-width:1px!important}.messageLine0{stroke-width:2px!important;stroke:var(--fore-color)!important}#arrowhead,#arrowhead path,[id^=arrowhead],[id^=arrowhead] path,g.stateGroup rect[height="7"]{fill:var(--fore-color)!important;stroke:none!important}.messageLine1{stroke-width:2px!important;stroke-dasharray:3px,3px!important;stroke:var(--fore-color)!important}.labelBox+.labelText,.sequenceNumber{fill:var(--doc-bg-color)!important;font-weight:900!important}#sequencenumber{fill:var(--mm-color-blue)!important;stroke:var(--doc-bg-color)!important;transform:scale(.7);transform-origin:15px 15px}#crosshead,#crosshead path{fill:var(--fore-color-alt)!important;stroke:var(--fore-color)!important}.messageText{fill:var(--fore-color)!important;stroke:none!important;font-size:.9em!important;font-family:"VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif!important;font-weight:400!important;line-height:2em!important}.activation0,.activation1,.activation2{fill:var(--mm-color-blue-alt)!important;stroke-width:0!important}.labelBox{stroke:none!important;fill:var(--mm-color-purple-light)!important}.labelBox+.labelText{fill:var(--mm-color-purple-alt-light)!important;font-size:.9em!important}.labelBox+.labelText,.loopText,.loopText>tspan,.noteText tspan,g.stateGroup .state-title,g.stateGroup text{font-family:"VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif!important}.loopText,.loopText>tspan{fill:var(--mm-color-purple-light)!important;font-weight:700!important}.loopLine{stroke-width:1px!important;stroke-dasharray:8px,8px!important;stroke:var(--mm-color-purple-light)!important}.note{stroke:var(--mm-color-yellow)!important;stroke-dasharray:5px!important;fill:var(--mm-color-yellow-alt)!important}.noteText tspan,g.stateGroup .state-title,g.stateGroup text{font-size:.9em!important}g.stateGroup circle{fill:var(--fore-color)!important;stroke:var(--doc-bg-color)!important}g.stateGroup line,g.stateGroup rect{fill:var(--mm-color-purple-alt)!important;stroke:var(--mm-color-purple)!important}.transition{stroke:var(--fore-color)!important}g.stateGroup .state-title,g.stateGroup text{fill:var(--fore-color)!important;font-weight:400!important;font-size:.5em!important}.stateLabel text{font-size:.5em!important}g.state-note{fill:var(--mm-color-gray-alt);stroke:var(--mm-color-gray)}.noteText tspan,g.cardinality text,g.classGroup text,g.classLabel .label{font-weight:400!important;fill:var(--fore-color)!important;stroke:none!important}g.cardinality text,g.classGroup text,g.classLabel .label{font-family:"VLOOK Sans Mono","Noto Sans Mono",Iosevka,"SF Mono",Menlo,"Cascadia Mono",Consolas,Courier,"Courier New","VLOOK Sans Mono","Noto Sans Mono",Iosevka,"SF Mono",Menlo,"Cascadia Mono",Consolas,Courier,"Courier New","VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","VLOOK Sans Mono","Noto Sans Mono",Iosevka,"SF Mono",Menlo,"Cascadia Mono",Consolas,Courier,"Courier New","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",monospace!important}g.classGroup rect,g.classLabel .box{fill:var(--mm-color-brown-alt)!important}.relation,g.classGroup line,g.classGroup rect{stroke:var(--mm-color-brown)!important}.relation,g.classGroup line{stroke-width:1px!important}g.classLabel .box{stroke:none!important;opacity:.5!important}.relation{stroke:var(--fore-color)!important;fill:none!important}#aggregationEnd,#aggregationStart,#compositionEnd,#compositionStart,#dependencyEnd,#dependencyStart,#extensionEnd,#extensionStart,.aggregation,.composition{fill:var(--fore-color)!important;stroke:var(--fore-color)!important;stroke-width:1px!important}div.mermaidTooltip{position:absolute!important;text-align:center!important;max-width:200px!important;padding:2px!important;background:var(--fore-color-alt)!important;border:1px solid #d0d0d0!important;border-radius:var(--vlook-small-radius)!important;pointer-events:none!important;z-index:100!important}.section{stroke:none!important}.section0,.section2{fill:var(--fore-color-alt)!important}.section1,.section3{fill:rgba(24,26,30,.05)!important}.sectionTitle0,.sectionTitle1,.sectionTitle2,.sectionTitle3{fill:var(--fore-color)!important}.sectionTitle{text-anchor:start!important;font-size:.8em!important;line-height:2em!important}.grid .tick{stroke:var(--fore-color-alt)!important;shape-rendering:crispEdges!important}.grid path,g.classLabel .box{stroke-width:0!important}.today{fill:none;stroke:var(--mm-color-red)!important;stroke-width:3px!important}.task{stroke-width:2px!important}.taskText,.taskTextOutsideLeft,.taskTextOutsideRight{font-family:"VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif!important;font-weight:400!important}.taskText{text-anchor:middle!important;font-size:.8em!important;line-height:2em!important}.taskTextOutsideLeft,.taskTextOutsideRight{fill:var(--fore-color)!important;text-anchor:start!important}.taskTextOutsideLeft{text-anchor:end!important}.active0,.active1,.active2,.active3{fill:var(--mm-color-blue-alt)!important;stroke:var(--mm-color-blue)!important}.activeText0,.activeText1,.activeText2,.activeText3{fill:var(--mm-color-blue)!important}.done0,.done1,.done2,.done3{stroke:none!important;fill:var(--mm-color-blue-alt)!important;stroke-width:2px!important;stroke-dasharray:2px!important}.task0,.task1,.task2,.task3{fill:var(--doc-bg-color)!important;stroke:var(--mm-color-blue)!important;stroke-dasharray:2px!important}.doneText0,.doneText1,.doneText2,.doneText3,.taskText0,.taskText1,.taskText2,.taskText3,.taskTextOutside0,.taskTextOutside1,.taskTextOutside2,.taskTextOutside3{fill:var(--fore-color)!important}.activeCrit0,.activeCrit1,.activeCrit2,.activeCrit3{stroke:var(--mm-color-red)!important;fill:var(--mm-color-red-alt)!important;stroke-width:2px!important}.activeCritText0,.activeCritText1,.activeCritText2,.activeCritText3{fill:var(--mm-color-red)!important}.doneCrit0,.doneCrit1,.doneCrit2,.doneCrit3{stroke:none!important;fill:var(--mm-color-red-alt)!important;stroke-width:2px!important;cursor:pointer!important;shape-rendering:crispEdges!important}.crit0,.crit1,.crit2,.crit3{stroke:var(--mm-color-red)!important;fill:var(--doc-bg-color)!important;stroke-width:2px!important;stroke-dasharray:2px!important}.critText0,.critText1,.critText2,.critText3,.doneCritText0,.doneCritText1,.doneCritText2,.doneCritText3,.titleText{fill:var(--fore-color)!important}.titleText{text-anchor:middle!important;font-size:1.5em!important;line-height:2em!important;font-family:"VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif!important;font-weight:900!important}.entityBox{fill:var(--mm-color-pink-alt)!important;stroke:var(--mm-color-pink)!important}#write{max-width:100%;margin:0 auto;padding:10px 20px}#write>ol:first-child,#write>ul:first-child{margin-top:30px}#write pre.ty-contain-cm,sup.md-footnote>a{padding:0;border-radius:var(--vlook-base-radius)}.CodeMirror-scroll{border-radius:var(--vlook-table-radius)}.CodeMirror-sizer{background-color:var(--doc-bg-color)}.CodeMirror pre{padding:0 10px}.CodeMirror-line:hover{background-color:var(--doc-bg-color-alt)}.CodeMirror.cm-s-inner{border-radius:var(--vlook-table-radius)}.CodeMirror div.CodeMirror-cursor{border-color:var(--cm-CodeMirror-cursor);border-left:1px solid #b8bfc6;z-index:3}.cm-s-inner .cm-operator,.cm-s-inner .cm-property,.cm-s-inner .cm-variable{color:var(--cm-variable)}.cm-s-inner .cm-variable-2{color:var(--cm-variable-2)}.cm-s-inner .cm-variable-3{color:var(--cm-variable-3)}.cm-s-inner .cm-keyword{color:var(--cm-keyword)}.cm-s-inner .cm-tag{color:var(--cm-tag)}.cm-s-inner .cm-attribute{color:var(--cm-attribute)}.cm-s-inner .cm-string{color:var(--cm-string)}.cm-s-inner .cm-string-2{color:var(--cm-string-2)}.cm-s-inner .cm-comment,.cm-s-inner.cm-comment{color:var(--cm-comment)}.cm-s-inner .cm-def,.cm-s-inner .cm-header,.cm-s-inner.cm-def,.cm-s-inner.cm-header{color:var(--cm-header)}.cm-s-inner .cm-quote,.cm-s-inner.cm-quote{color:var(--cm-quote)}.cm-s-inner .cm-hr{color:var(--cm-hr)}.cm-s-inner .cm-link{color:var(--cm-link)}.cm-s-inner .cm-negative{color:var(--cm-negative)}.cm-s-inner .cm-positive{color:var(--cm-positive)}.cm-s-inner .cm-meta,.cm-s-inner .cm-qualifier{color:var(--cm-meta)}.cm-s-inner .cm-builtin{color:var(--cm-bulidin)}.cm-s-inner .cm-bracket{color:var(--cm-bracket)}.cm-s-inner .cm-atom,.cm-s-inner.cm-atom{color:var(--cm-atom)}.cm-s-inner .cm-number{color:var(--cm-number)}.MathJax_SVG_Display{border:0;overflow-x:auto;border:2px solid var(--doc-bg-color-alt);border-radius:var(--vlook-base-radius);padding:10px;cursor:pointer}.MathJax_SVG g[id^=mjx-eqn-]{fill:var(--fore-color-alt)}.MathJax_SVG_Display:hover{border-color:#7735cc}.MathJax_SVG_Display:active{transform:scale(1.5);border:0}.MathJax_SVG g text{color:var(--fore-color)}.md-toc-inner,.md-toc-item a:hover{text-decoration:none;box-shadow:none}.md-toc-item,.mdx-toc-item{color:var(--fore-color);font-family:"VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif;font-weight:400;font-size:1em;margin-left:10px;margin-right:10px;border-radius:var(--vlook-small-radius);text-overflow:ellipsis;overflow:hidden;cursor:pointer}.md-toc-item{padding-right:5px;white-space:nowrap}.mdx-toc-item{white-space:normal;line-height:1.5;padding:5px;margin-bottom:5px;display:block}.md-toc-item::before{color:var(--toc-header-num-color);padding-left:5px}.md-toc-item:hover,.mdx-toc-item:hover{background-color:var(--blockquote-bg)}.md-toc-item:active,.mdx-toc-item:active{color:var(--doc-bg-color);background-color:var(--fore-color-alt);box-shadow:0 0 0 2px var(--tbl-border-color);transition:none}.md-toc-item:active::before,.mdx-toc-item:active::before,.mdx-toc-item:active>span{color:var(--doc-bg-color)}.mdx-caption-1>span,.mdx-toc-item>span{color:var(--fore-color-alt);font-size:.85em}.md-toc,.mdx-toc{margin-top:20px;margin-bottom:.5em;border-radius:0;line-height:2;font-size:1em}.md-toc-item a{text-decoration:none;padding:0;border-radius:0;border:0}.md-toc-item a:hover{color:var(--fore-color)!important;border:0}sup.md-footnote{color:var(--fore-color-alt);background:0 0;padding:0;margin-left:.2em;margin-right:.2em}sup.md-footnote>a{color:var(--doc-bg-color)!important;background-color:var(--fore-color-alt);margin:0;box-shadow:none;border-bottom:none;padding:0 5px;font-size:.8em}sup.md-footnote>a:hover{background-color:#7735cc;color:#fff!important}.footnote-line>a:not(.reversefootnote){color:var(--fore-color)}kbd{font-family:"VLOOK Sans Mono","Noto Sans Mono",Iosevka,"SF Mono",Menlo,"Cascadia Mono",Consolas,Courier,"Courier New","VLOOK Sans Mono","Noto Sans Mono",Iosevka,"SF Mono",Menlo,"Cascadia Mono",Consolas,Courier,"Courier New","VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","VLOOK Sans Mono","Noto Sans Mono",Iosevka,"SF Mono",Menlo,"Cascadia Mono",Consolas,Courier,"Courier New","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",monospace;font-weight:900;font-size:.875em;border-radius:var(--vlook-tag-radius);margin:0 5px;padding:2px 8px;border:2px solid var(--fore-color);color:var(--doc-bg-color);background-color:var(--fore-color);box-shadow:0 0 0 2px var(--doc-bg-color-alt) inset}ul>.md-task-list-item{list-style-type:decimal!important}ul>li>ul>.md-task-list-item{list-style-type:lower-alpha!important}ul>li>ul>li>ul>.md-task-list-item{list-style-type:disc!important}ul>li>ul>li>ul>li>ul>.md-task-list-item{list-style-type:lower-roman!important}ul>li>ul>li>ul>li>ul>li>ul>.md-task-list-item{list-style-type:circle!important}ul>li>ul>li>ul>li>ul>li>ul>li>ul>.md-task-list-item{list-style-type:square!important}.md-task-list-item>input{margin-left:-.5em!important;margin-top:.3em!important}.md-task-list-item>p{margin-left:1.25em!important;margin-top:0;margin-bottom:0}li p,li>:first-child{margin-top:0;margin-bottom:0}.mdx-font-header-sans,.mdx-font-subtitle-sans,.mdx-font-title-sans{font-family:"VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif!important}.mdx-font-text-sans{font-weight:400}.mdx-font-bold-sans,.mdx-font-text-sans{font-family:"VLOOK Sans Mono","Noto Sans Mono",Iosevka,"SF Mono",Menlo,"Cascadia Mono",Consolas,Courier,"Courier New","VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif!important}.mdx-font-number-sans{font-family:"VLOOK Number","Altinn-DIN","Bebas Neue","DIN","VLOOK Sans Mono","Noto Sans Mono",Iosevka,"SF Mono",Menlo,"Cascadia Mono",Consolas,Courier,"Courier New","VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif!important}.mdx-font-tag-sans{font-family:"VLOOK Sans Mono","Noto Sans Mono",Iosevka,"SF Mono",Menlo,"Cascadia Mono",Consolas,Courier,"Courier New","VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif!important;font-weight:400}.mdx-font-code-sans{font-family:"VLOOK Sans Mono","Noto Sans Mono",Iosevka,"SF Mono",Menlo,"Cascadia Mono",Consolas,Courier,"Courier New","VLOOK Sans Mono","Noto Sans Mono",Iosevka,"SF Mono",Menlo,"Cascadia Mono",Consolas,Courier,"Courier New","VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","VLOOK Sans Mono","Noto Sans Mono",Iosevka,"SF Mono",Menlo,"Cascadia Mono",Consolas,Courier,"Courier New","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",monospace!important}.mdx-font-weight-bold-sans{font-weight:900!important}.mdx-font-title-serif{font-family:"VLOOK Serif","Noto Serif CJK SC","Source Han Serif SC","思源宋体","Times New Roman",Times,"Songti SC",SimSun,"宋体",STZhongsong,"华文中宋",serif!important}.mdx-font-subtitle-serif{font-family:"VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Helvetica Neue",Helvetica,Arial,Tahoma,SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif!important}.mdx-font-header-serif{font-family:"VLOOK Serif","Noto Serif CJK SC","Source Han Serif SC","思源宋体","Times New Roman",Times,"Songti SC",SimSun,"宋体",STZhongsong,"华文中宋",serif!important}.mdx-font-text-serif{font-family:"VLOOK Serif Mono","Luxi Mono","Iosevka Slab","PT Mono",Courier,"Courier New","VLOOK Sans Mono","Noto Sans Mono",Iosevka,"SF Mono",Menlo,"Cascadia Mono",Consolas,Courier,"Courier New","VLOOK Serif","Noto Serif CJK SC","Source Han Serif SC","思源宋体","Times New Roman",Times,"Songti SC",SimSun,"宋体",STZhongsong,"华文中宋",serif;font-weight:400}.mdx-font-tag-serif{font-weight:400}.mdx-font-bold-serif,.mdx-font-tag-serif{font-family:"VLOOK Sans Mono","Noto Sans Mono",Iosevka,"SF Mono",Menlo,"Cascadia Mono",Consolas,Courier,"Courier New","VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Helvetica Neue",Helvetica,Arial,Tahoma,SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif!important}.mdx-font-number-serif{font-family:"VLOOK Number","Altinn-DIN","Bebas Neue","DIN","VLOOK Sans Mono","Noto Sans Mono",Iosevka,"SF Mono",Menlo,"Cascadia Mono",Consolas,Courier,"Courier New","VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Helvetica Neue",Helvetica,Arial,Tahoma,SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif!important}.mdx-font-code-serif{font-family:"VLOOK Sans Mono","Noto Sans Mono",Iosevka,"SF Mono",Menlo,"Cascadia Mono",Consolas,Courier,"Courier New","VLOOK Serif Mono","Luxi Mono","Iosevka Slab","PT Mono",Courier,"Courier New","VLOOK Sans Mono","Noto Sans Mono",Iosevka,"SF Mono",Menlo,"Cascadia Mono",Consolas,Courier,"Courier New","VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",monospace!important}.mdx-font-weight-bold-serif{font-weight:700!important}.mdx-spotlight{display:none;position:fixed;left:0;top:0;width:100%;height:100%;background-size:cover;pointer-events:none;z-index:5000}.mdx-cursor-laser{cursor:url(),auto!important}.mdx-transition-all{transition:all var(--vlook-transition-duration) ease-in-out}.mdx-transition-box-shadow{transition:box-shadow var(--vlook-transition-duration) ease-in-out}.mdx-transition-opacity{transition:opacity var(--vlook-transition-duration) ease-in-out}.mdx-transition-left{transition:left var(--vlook-transition-duration) ease-in-out}.mdx-transition-background{transition:background var(--vlook-transition-duration) ease-in-out}.mdx-info-tips,.mdx-tool-tips{position:fixed;margin-left:auto;border-radius:var(--vlook-base-radius);border:1px solid var(--tbl-border-color);font-family:"VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif;font-weight:400;color:var(--tips-bg-color-inset);background-color:var(--tips-bg-color);cursor:default;z-index:3000}.mdx-info-tips{display:none;padding:10px;text-align:center;white-space:pre-wrap}.mdx-info-tips.error{color:#fff;border-color:var(--acc-color-red-light);background-color:var(--acc-color-red-light)}.mdx-tool-tips{visibility:hidden;opacity:0;display:block;padding:5px 10px;border-top:0;box-shadow:0 2px 0 0 #7735cc inset,0 2px 10px rgba(0,0,0,.3),0 0 0 0 transparent;text-align:left;white-space:pre;font-size:.85em}.mdx-tool-tips.accent{box-shadow:0 2px 0 0 #00a8be inset,0 2px 10px rgba(0,0,0,.3),0 0 0 0 transparent}.mdx-info-tips a,.mdx-tool-tips a{color:var(--tips-bg-color-inset)!important;font-weight:900}.mdx-bottom-tips,.mdx-font-styler{display:none;position:fixed;text-align:center;font-family:"VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif}.mdx-bottom-tips{font-weight:900;color:#fff;width:100%;height:60px;bottom:0;padding-top:16px;background:linear-gradient(0deg,#000,transparent);pointer-events:none;z-index:5001}.mdx-bottom-tips>div{bottom:10px;width:100%;position:fixed}.mdx-bottom-tips kbd{color:#000;background-color:#fff;box-shadow:0 0 0 2px #000 inset;border:2px solid var(--doc-bg-color-alt)}.mdx-font-styler{width:630px;padding:10px;border-radius:var(--vlook-base-radius);border:1px solid var(--tbl-border-color);font-weight:400;color:var(--tips-bg-color-inset);background-color:var(--tips-bg-color);z-index:3000}.mdx-font-styler-info{width:100%;overflow:auto;border-radius:var(--vlook-small-radius)}.mdx-fontstyle-sans,.mdx-fontstyle-serif{border-radius:var(--vlook-small-radius)!important;filter:opacity(.6);cursor:pointer}.mdx-fontstyle-sans:hover,.mdx-fontstyle-serif:hover{filter:opacity(1);box-shadow:0 0 0 2px #7735cc}.mdx-fontstyle-sans:active,.mdx-fontstyle-serif:active{box-shadow:0 0 0 2px #7c5ba6}.mdx-fontstyle-sans.selected,.mdx-fontstyle-serif.selected{box-shadow:0 0 0 4px var(--header-color)!important;filter:opacity(1)!important}.mdx-fontinfo-sans,.mdx-fontinfo-serif{margin-top:10px;text-align:left;font-size:.9em}.mdx-fontinfo-sans #fontset-sans-status,.mdx-fontinfo-serif #fontset-serif-status{color:var(--fore-color-alt)}.mdx-content-expander{font-family:"VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif;font-weight:900;height:100px;margin-top:-120px;background:linear-gradient(0deg,var(--doc-bg-color) 10px,var(--doc-bg-color-transparent));border-radius:0 0 var(--vlook-base-radius) var(--vlook-base-radius);position:absolute;text-align:center;vertical-align:bottom;visibility:hidden;z-index:10}.mdx-content-expander>.mdx-btn{margin-top:70px;width:auto;padding-left:15px;padding-right:15px;font-size:.85em;border-radius:var(--vlook-small-radius);background-color:#00a8be}.mdx-doc-logo-dark,.mdx-doc-logo-light{margin-top:30px;width:100%;height:80px;background-image:url();background-size:80px 80px;background-repeat:no-repeat;background-position:top center}.mdx-doc-logo-dark{display:none;background-image:url()}.mdx-welcome-page{cursor:wait;position:fixed;color:#fff;background:linear-gradient(#004e58 0,#00a8be 50%,#00a8be);left:0;top:0;width:100%;height:100%;text-align:center;font-family:"VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif;font-size:1.25em;overflow:auto;visibility:hidden;opacity:0;z-index:6000}.mdx-welcome-page-tips{padding:20px 20px 10px;animation:1s breathe-text infinite alternate}.mdx-welcome-page-tips>div{text-align:center;line-height:1;margin-bottom:1em}.mdx-welcome-page-loading{cursor:not-allowed;padding-left:1em;padding-right:1em;color:#00dad8;border:1px solid rgba(0,218,216,.5);font-family:"VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif;font-weight:400;display:inline-block;border-radius:var(--vlook-base-radius);margin-bottom:2em}.mdx-btn-welcome-page-done{cursor:pointer;border:2px solid #00dad8;font-size:1.25em;font-weight:900;color:#00dad8;background-color:#7735cc;animation:1s breathe-button 1 alternate}.mdx-btn-welcome-page-done:hover{color:#7735cc;background-color:#00dad8;box-shadow:0 2px 10px rgba(0,0,0,.3)}.mdx-btn-welcome-page-done:active{border:0;color:#00dad8;background-color:#7735cc;box-shadow:0 0 0 2px rgba(119,53,204,.5);transform:none}.mdx-btn-welcome-page-done.wait{animation:1s breathe-button infinite alternate}.mdx-btn-welcome-page-done>span,h6 code{font-weight:400}.mdx-pg-current-item{box-shadow:0 0 10px 0 #7735cc;border-radius:var(--vlook-base-radius)}.md-diagram-panel svg{width:auto}.md-diagram-panel svg[viewBox^="-"],.mdx-figure-content svg[viewBox^="-"]{padding-bottom:8px}.mdx-figure-content svg:not([data-inject-url]){width:100%}.mdx-blockquote-folder{cursor:pointer}.mdx-nav-center{background-color:var(--doc-bg-color-alt);border-radius:var(--vlook-base-radius);cursor:default;display:block;left:var(--vlook-nav-center-hidden-left);top:10px;bottom:40px;width:var(--vlook-nav-center-width);padding:0;position:fixed;z-index:2000;user-select:none}.mdx-nav-center-float{top:20px;bottom:50px;box-shadow:0 2px 10px rgba(0,0,0,.3)}.mdx-nav-center-block{top:60px;bottom:10px;box-shadow:0 2px 10px rgba(0,0,0,.3),0 0 0 1px var(--tbl-border-color) inset}.mdx-nav-center-header{color:#181a1e;font-family:"VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif;font-weight:400;height:100px;padding:0;background:linear-gradient(180deg,var(--doc-bg-color-alt) 90px,var(--doc-bg-color-alt-transparent));left:1px;right:1px;top:1px;position:absolute;border-top-right-radius:var(--vlook-base-radius);border-top-left-radius:var(--vlook-base-radius);z-index:10}.mdx-segment{text-align:center;height:34px;border-radius:var(--vlook-small-radius);margin:10px;padding:2px;background-color:var(--blockquote-bg)}.mdx-segment>input[type=radio]{display:none}.mdx-segment>input[type=radio]:checked+.mdx-segment-btn>svg>use{fill:var(--fore-color)}.mdx-segment-btn,.mdx-segment-indicator{height:30px;border-radius:calc(var(--vlook-small-radius) - 1px)}.mdx-segment-indicator{position:absolute;left:12px;top:12px;width:40px;background-color:var(--doc-bg-color);z-index:0}.mdx-segment-btn{width:16%;justify-content:center;align-items:center;vertical-align:middle;float:left;cursor:pointer;position:relative;display:inline-flex;z-index:10}.mdx-segment-btn.hover{background-color:var(--blockquote-bg)}.mdx-segment-btn:active{background-color:var(--fore-color-alt);box-shadow:0 0 0 2px var(--tbl-border-color)}.mdx-segment-btn:active>svg>use{fill:var(--doc-bg-color)}.mdx-segment-btn.catalog,.mdx-segment-btn.codeblock,.mdx-segment-btn.figure,.mdx-segment-btn.multimedia,.mdx-segment-btn.table{margin:0 .8% 0 0}.mdx-segment-btn.history{margin:0}.mdx-nav-center-body{width:100%;height:100%;padding:70px 1px 10px;border-radius:var(--vlook-base-radius);overflow:auto;overflow-y:hidden}.mdx-nav-center-body.mini{padding-bottom:85px}.mdx-toc-catalog-body{width:100%;height:100%;padding:10px 0 0;overflow-y:scroll}.mdx-nav-center-footer{height:30px;line-height:40px;left:1px;right:1px;bottom:1px;text-align:center;padding:0;background:linear-gradient(0deg,var(--doc-bg-color-alt) 10px,var(--doc-bg-color-alt-transparent));border-bottom-right-radius:var(--vlook-base-radius);border-bottom-left-radius:var(--vlook-base-radius);position:absolute;z-index:10;pointer-events:none}.mdx-nav-center-footer.mini{bottom:76px;border-radius:0}.mdx-toc-handle{position:fixed;display:none;top:390px;left:8px;width:4px;height:80px;background-color:var(--tbl-border-color);border-radius:2px;z-index:2000}.mdx-toc-handle.hover{background-color:var(--fore-color)}.mdx-copyright{left:0;bottom:0;text-align:center;width:100%;height:40px;padding:5px 10px;font-size:.85em;font-family:"VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif;font-weight:400;position:absolute}.mdx-copyright,.mdx-copyright a{color:#fff!important}.mdx-float-card{box-shadow:0 2px 10px rgba(0,0,0,.3),0 0 0 0 transparent}.mdx-foot-note-panel{position:fixed;left:15%;right:15%;bottom:90px;height:200px;border-radius:var(--vlook-base-radius);box-shadow:0 2px 10px rgba(0,0,0,.3);margin:0 auto;background-color:var(--doc-bg-color-alt);display:none;z-index:2100}.mdx-foot-note-panel>a{color:var(--fore-color)}.mdx-foot-note-panel-header{height:30px;top:2px;left:2px;right:2px;position:absolute;background:linear-gradient(180deg,var(--doc-bg-color-alt) 5px,var(--doc-bg-color-alt-transparent));border-radius:var(--vlook-base-radius)}.mdx-foot-note-panel-content{width:100%;top:2px;bottom:2px;padding:10px 20px;position:absolute;overflow-x:auto}.mdx-foot-note-panel-all{font-weight:900;height:60px;left:2px;right:2px;line-height:70px;bottom:0;padding:0 20px;margin:2px;border-radius:var(--vlook-base-radius);background:linear-gradient(0deg,var(--doc-bg-color-alt) 35px,var(--doc-bg-color-alt-transparent));position:absolute}.mdx-more-doc-content-after,.mdx-more-doc-content-before{width:100%;height:60px;position:fixed;pointer-events:none;z-index:99}.mdx-more-doc-content-before{background:linear-gradient(180deg,var(--doc-bg-color),var(--doc-bg-color-transparent));top:0;display:none}.mdx-more-doc-content-after{background:linear-gradient(0deg,var(--doc-bg-color),var(--doc-bg-color-transparent));bottom:0;display:block}.mdx-toolbar{border-bottom-left-radius:var(--vlook-base-radius);border-bottom-right-radius:var(--vlook-base-radius);left:20px;top:10px;padding:10px;width:var(--vlook-nav-center-width);height:50px;position:fixed;background-color:#00a8be;display:none;z-index:100}.mdx-toolbar.cover{width:auto;right:20px;background:0 0}.mdx-toolbar-spliter{display:flex;width:40px;height:30px;padding:0;float:right}.mdx-toolbar-smallscreen{top:50px;padding-left:0;padding-right:0}.mdx-btn.outline{display:flex;justify-content:center;align-items:center;color:#fff;cursor:pointer;float:left;height:30px;padding-top:0;text-align:center;visibility:visible}.mdx-toc-item-current{font-weight:900;color:#00a8be;background-color:var(--doc-bg-color);box-shadow:0 0 0 2px rgba(0,168,190,.5) inset}.mdx-toc-folder{color:#737c8f;float:left;width:20px;text-align:center}.mdx-toc-folder.hover>svg>use{fill:#7735cc!important}.mdx-toc-folder.hover:active>svg>use{fill:#fff!important}.mdx-btn{display:inline-flex;justify-content:center;align-items:center;vertical-align:top;color:#fff;cursor:pointer;padding:0;width:var(--vlook-toolbar-btn-width);height:30px;border-radius:var(--vlook-small-radius)}.mdx-btn.selected{background-color:#004e58!important;box-shadow:0 0 0 0 transparent}.mdx-btn.first{border-radius:var(--vlook-small-inner-radius) 0 0 var(--vlook-small-inner-radius)!important}.mdx-btn.middle{border-radius:0!important}.mdx-btn.last{border-radius:0 var(--vlook-small-inner-radius) var(--vlook-small-inner-radius) 0!important}.mdx-btn.hover{background-color:#7735cc!important;color:#00dad8!important}.mdx-btn.hover>svg>use,.mdx-chapter-nav-next.effect.hover>svg>use,.mdx-chapter-nav-next.noeffect.hover>svg>use,.mdx-chapter-nav-prev.effect.hover>svg>use,.mdx-chapter-nav-prev.noeffect.hover>svg>use{fill:#00dad8}.mdx-audio-mini-control,.mdx-btn-group.float,.mdx-btn.float{background-color:#00a8be}.mdx-btn:active{background-color:#7c5ba6!important;box-shadow:0 0 0 2px rgba(124,91,166,.5)!important;transition:none;z-index:1}.mdx-audio-mini-control.loading{animation:loading-circle 2s linear infinite}.mdx-audio-mini-control{border-radius:var(--vlook-circle-radius);text-align:center;line-height:30px;height:30px;width:30px;padding:2px;justify-content:center;align-items:center;vertical-align:middle;display:inline-flex;cursor:pointer}.mdx-audio-mini-control.disabled{background-color:#b0b4b8;cursor:not-allowed}.mdx-audio-mini-control.hover{background-color:#7735cc;box-shadow:0 2px 10px rgba(0,0,0,.3);color:#00dad8}.mdx-audio-mini-control.hover:active{background-color:#7c5ba6}.mdx-duration-info{color:var(--doc-bg-color);border-radius:0 var(--vlook-tag-radius) var(--vlook-tag-radius) var(--vlook-tag-radius);padding:0 5px;background-color:var(--fore-color-alt);font-weight:700}.mdx-audio-mini-control.playing{animation:500ms breathe-circle infinite alternate}.mdx-chapter-nav,.mdx-chapter-nav-prev{height:50px;border-bottom-left-radius:var(--vlook-base-radius)}.mdx-chapter-nav{color:#fff;background-color:#00a8be;border-bottom-right-radius:var(--vlook-base-radius);top:-50px;left:calc(var(--vlook-nav-center-width) + 50px);right:20px;position:fixed;padding:0;vertical-align:middle;z-index:100;user-select:none;display:none}.mdx-chapter-nav-prev{top:0;left:0;width:20%;position:absolute;cursor:pointer}.mdx-chapter-nav-prev.effect::before,.mdx-chapter-nav-prev.noeffect.hover{background:linear-gradient(to right,#7735cc,#00a8be);border-bottom-left-radius:var(--vlook-base-radius)}.mdx-chapter-nav-prev.effect.hover>.mdx-chapter-nav-prev-text,.mdx-chapter-nav-prev.noeffect.hover>.mdx-chapter-nav-prev-text{color:#00dad8}.mdx-chapter-nav-prev.effect::before{content:"";position:absolute;left:0;right:0;top:0;bottom:0;opacity:0;z-index:-1;transition:all var(--vlook-transition-duration) ease-in}.mdx-chapter-nav-prev.effect.hover::before{opacity:1}.mdx-chapter-nav-prev.effect:active,.mdx-chapter-nav-prev.effect:active::before,.mdx-chapter-nav-prev.noeffect:active{background:linear-gradient(to right,#7c5ba6,#00a8be)}.mdx-chapter-nav-current,.mdx-chapter-nav-doc-title,.mdx-chapter-nav-prev-text{font-family:"VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;display:block}.mdx-chapter-nav-prev-text{top:0;left:30px;width:100%;height:50px;line-height:50px;font-weight:400;color:#fff;text-align:left;position:absolute}.mdx-chapter-nav-current,.mdx-chapter-nav-doc-title{text-align:center;margin-left:200px;margin-right:200px;width:auto;cursor:pointer}.mdx-chapter-nav-doc-title{font-size:.75em;font-weight:400;line-height:24px;height:22px!important}.mdx-chapter-nav-doc-title.in-start{margin-left:15px;font-size:1.25em;font-weight:900;text-align:left;height:50px!important;line-height:50px;cursor:default}.mdx-chapter-nav-current{font-weight:900;line-height:22px;height:28px}.mdx-chapter-nav-current.effect.hover,.mdx-chapter-nav-doc-title.effect.hover,.mdx-chapter-nav-next.effect.hover>.mdx-chapter-nav-next-text,.mdx-chapter-nav-next.noeffect.hover>.mdx-chapter-nav-next-text{color:#00dad8}.mdx-chapter-nav-current.noeffect.hover,.mdx-chapter-nav-doc-title.noeffect.hover{background:linear-gradient(90deg,rgba(119,53,204,0),#7735cc,rgba(119,53,204,0));height:28px;color:#00dad8}.mdx-chapter-nav-current.effect::before,.mdx-chapter-nav-doc-title.effect::before{content:"";position:absolute;bottom:0;left:30%;right:30%;background:linear-gradient(90deg,rgba(119,53,204,0),#7735cc,rgba(119,53,204,0));opacity:0;z-index:-1;transition:all var(--vlook-transition-duration) ease-in}.mdx-chapter-nav-current.effect::before{top:22px;height:28px}.mdx-chapter-nav-doc-title.effect::before{top:0;height:22px}.mdx-chapter-nav-current.effect.hover::before,.mdx-chapter-nav-doc-title.effect.hover::before{opacity:1}.mdx-chapter-nav-current.effect:active,.mdx-chapter-nav-current.effect:active::before,.mdx-chapter-nav-current.noeffect:active,.mdx-chapter-nav-doc-title.effect:active,.mdx-chapter-nav-doc-title.effect:active::before,.mdx-chapter-nav-doc-title.noeffect:active{background:linear-gradient(90deg,rgba(124,91,166,0),#7c5ba6,rgba(124,91,166,0));box-shadow:none}.mdx-chapter-nav-next{top:0;right:0;width:20%;height:50px;position:absolute;cursor:pointer;border-bottom-right-radius:var(--vlook-base-radius)}.mdx-chapter-nav-next.effect::before,.mdx-chapter-nav-next.noeffect.hover{background:linear-gradient(to left,#7735cc,#00a8be);border-bottom-right-radius:var(--vlook-base-radius)}.mdx-chapter-nav-next.effect::before{content:"";position:absolute;left:0;right:0;top:0;bottom:0;opacity:0;z-index:-1;transition:all var(--vlook-transition-duration) ease-in}.mdx-chapter-nav-next.effect.hover::before{opacity:1}.mdx-chapter-nav-next.effect:active,.mdx-chapter-nav-next.effect:active::before,.mdx-chapter-nav-next.noeffect:active{background:linear-gradient(to left,#7c5ba6,#00a8be)}.mdx-chapter-nav-next-text{top:0;right:30px;width:100%;height:50px;line-height:50px;font-family:"VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif;font-weight:400;color:#fff;text-align:right;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:absolute;display:block}.mdx-btn.color-scheme,.mdx-btn.font-style{margin-left:var(--vlook-toolbar-btn-space);float:right}.mdx-accent-btn,.mdx-btn-group.prs{height:30px;border-radius:var(--vlook-small-radius)}.mdx-btn-group.prs{margin:0;float:right;margin-left:var(--vlook-toolbar-btn-space)}.mdx-btn-group.hover{background-color:#008d9f;box-shadow:0 0 0 0 transparent}.mdx-accent-btn{width:40px;position:absolute;text-align:center;box-shadow:0 0 0 1px var(--tbl-border-color) inset;cursor:pointer}.mdx-accent-btn>svg>use{fill:#00a8be}.mdx-accent-btn.hover{background-color:var(--blockquote-bg)}.mdx-accent-btn:active{color:var(--doc-bg-color);background-color:var(--fore-color-alt);box-shadow:0 0 0 2px var(--tbl-border-color)}.mdx-accent-btn:active>svg>use{fill:var(--doc-bg-color)}.mdx-accent-btn+.mdx-textfield,.mdx-textfield{margin:0 10px 0 0}.mdx-accent-btn.figure-nav.disabled{cursor:not-allowed}.mdx-accent-btn.figure-nav.disabled>svg>use{fill:var(--blockquote-bg)}.mdx-textfield{background-color:var(--doc-bg-color);border-radius:var(--vlook-small-radius);box-shadow:0 0 0 1px var(--tbl-border-color) inset;height:30px;float:right}.mdx-textfield-focus,.mdx-textfield.hover-action{box-shadow:0 0 0 2px rgba(0,168,190,.5),0 0 0 1px #00a8be inset}input::placeholder{color:var(--fore-color-alt)}.mdx-textfield>input{padding:0;margin:1px 0 0 10px;height:28px;color:var(--fore-color);background-color:var(--doc-bg-color);border:0;float:left;outline:0 solid transparent}.mdx-textfield>input.set-icon{margin-left:0}.mdx-textfield-action,.mdx-textfield-icon{width:30px;height:30px;text-align:center;float:left}.mdx-textfield-action{width:40px;border-radius:0 var(--vlook-small-radius) var(--vlook-small-radius) 0;box-shadow:1px 0 0 0 var(--blockquote-bg) inset;float:right}.mdx-textfield-action.enabled{background-color:#00a8be;box-shadow:none}.mdx-textfield-action.enabled>svg>use{fill:#fff;opacity:1}.mdx-textfield-action.hover{background-color:#7735cc;cursor:pointer}.mdx-textfield-action.hover>svg>use{fill:#00dad8}.mdx-textfield-action.hover:active{background-color:#7c5ba6}.mdx-textfield-reset{width:30px;height:30px;justify-content:center;align-items:center;vertical-align:middle;text-align:center;float:right;display:none;cursor:pointer}.mdx-textfield-reset:hover>svg>use{opacity:.4}.mdx-textfield-reset:active>svg>use{opacity:.6}.mdx-accent-btn.figure-nav{display:inline-block;margin:0 10px 10px}.mdx-toc-filter-result,.mdx-toc-history-result{display:none;width:100%;height:100%;padding:30px 0 10px;overflow-y:scroll}.mdx-toc-filter-result-none,.mdx-toc-history-none,.mdx-toc-history-title{text-align:center;font-family:"VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif}.mdx-toc-filter-result-none,.mdx-toc-history-none{display:block;line-height:3;padding:0 10px;color:var(--fore-color-alt)}.mdx-toc-history-title{position:absolute;border-radius:var(--vlook-small-radius);left:10px;right:10px;display:inline-block;padding-left:10px;padding-right:10px;white-space:nowrap;color:var(--a-color)}.mdx-btn.print{margin-left:var(--vlook-toolbar-btn-space);float:left}.mdx-figure-nav{left:0;top:0;width:100%;height:100%;background:radial-gradient(ellipse,rgba(0,0,0,.5),rgba(0,0,0,.9));position:fixed;visibility:hidden;opacity:0;z-index:2200}.mdx-btn-close-figure-nav,.mdx-figure-nav-btns{display:flex;justify-content:center;align-items:center;vertical-align:middle;color:#fff;cursor:pointer;padding:0}.mdx-figure-nav-btns.next,.mdx-figure-nav-btns.prev{top:auto;width:30px;height:70px;box-shadow:0 0 0 0 transparent;border-radius:var(--vlook-base-radius);position:absolute;bottom:10px}.mdx-figure-nav-btns.prev{left:10px}.mdx-figure-nav-btns.next{right:10px}.mdx-btn-close-figure-nav{justify-content:flex-end;align-items:normal;background-color:#00a8be;right:-2px;top:-2px;width:50px;height:50px;padding:12px 12px 8px 8px;box-shadow:0 0 0 0 transparent;border-radius:0 0 0 50px;position:absolute}.mdx-btn-close-figure-nav:hover{background-color:#7735cc;box-shadow:0 2px 10px rgba(0,0,0,.3);transform:translate(-2px,2px)}.mdx-btn-close-figure-nav:active{background-color:#7c5ba6;box-shadow:0 0 0 2px rgba(124,91,166,.5)!important;box-shadow:none;transform:none}.mdx-btn.assistor,.mdx-content-assistor{height:26px;border-radius:var(--vlook-small-inner-radius)}.mdx-content-assistor{visibility:hidden;opacity:1;position:absolute;z-index:50}.mdx-btn.assistor{top:0;width:30px;background-color:#00a8be;position:relative;display:none}.mdx-btn.assistor.enabled{display:inline-flex}.mdx-pic-in-pic{display:none;position:fixed;background-color:var(--header-color);border-radius:calc(var(--vlook-base-radius) + var(--vlook-base-radius) - var(--vlook-table-radius));right:20px;bottom:10px;padding:4px;box-shadow:0 4px 20px rgba(0,0,0,.3);z-index:500}.mdx-pic-in-pic>.mdx-content{overflow:auto;height:100%;border-radius:calc(var(--vlook-base-radius) - 2px)}.mdx-pic-in-pic>.mdx-content>.mdx-figure,.mdx-pic-in-pic>.mdx-content>table{border-radius:calc(var(--vlook-base-radius) - 2px)!important}.mdx-pic-in-pic>.mdx-content>table td,.mdx-pic-in-pic>.mdx-content>table th{white-space:pre!important}.mdx-pip-btn{position:absolute;display:inline-flex;visibility:hidden;opacity:0;background-color:var(--doc-bg-color);border-radius:50%;top:8px;justify-content:center;align-items:center;vertical-align:middle;cursor:pointer;z-index:20}.mdx-pip-btn.min.zoom-in{top:6px}.mdx-pip-btn.min.zoom-out{top:3px}.mdx-pip-btn.mdx-close{right:8px}.mdx-pip-btn.mdx-zoom.zoom-in{right:32px}.mdx-pip-btn.mdx-zoom.zoom-out{right:38px}.mdx-pip-btn.zoom-in{width:20px;height:20px}.mdx-pip-btn.zoom-out{width:26px;height:26px}.mdx-pip-btn.zoom-in>svg{transform:scale(1)}.mdx-pip-btn.zoom-out>svg{transform:scale(1.33)}.mdx-pip-btn:hover>svg>use{fill:#7735cc}.mdx-pip-btn:active>svg>use,use.mdx-blockquote-folder-ico:active{fill:#7c5ba6}.mdx-doc-lib-board{display:none;left:10px;right:10px;bottom:10px;height:50px;z-index:20}.mdx-doc-lib-board.item{border-radius:var(--vlook-small-radius);color:#fff;background-color:#00a8be;background-image:url();background-position:top center;background-repeat:no-repeat;font-family:"VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif;font-weight:900;font-size:1.25em;line-height:1.5;text-align:center;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;padding:12px 10px 0;position:absolute;cursor:pointer;z-index:23}.mdx-doc-lib-board.flip{left:70px;right:70px;bottom:68px;height:4px;position:absolute;background-color:var(--fore-color);opacity:.18;border-radius:calc(var(--vlook-small-radius) - 3px) calc(var(--vlook-small-radius) - 3px) 0 0;z-index:21}.mdx-doc-lib-board.flip+.flip,.mdx-doc-lib-board.item.hover+.flip+.flip{border-radius:calc(var(--vlook-small-radius) - 1px) calc(var(--vlook-small-radius) - 1px) 0 0}.mdx-doc-lib-board.flip+.flip{left:40px;right:40px;bottom:61px;height:6px;background-color:var(--fore-color);opacity:.3;z-index:22}.mdx-doc-lib-board.item.hover{background-color:#7735cc;color:#00dad8}.mdx-doc-lib-board.item.hover+.flip{left:50px;right:50px;bottom:76px;height:8px;border-radius:calc(var(--vlook-small-radius) - 2px) calc(var(--vlook-small-radius) - 2px) 0 0}.mdx-doc-lib-board.item.hover+.flip+.flip{left:30px;right:30px;bottom:62px;height:12px}.mdx-doc-lib-board.item:active{background-color:#7c5ba6!important;box-shadow:0 0 0 2px rgba(124,91,166,.5)!important}.md-diagram-panel,.mdx-doc-lib{border-radius:var(--vlook-base-radius)}.mdx-doc-lib{display:none;background-color:var(--doc-bg-color);box-shadow:0 0 0 2px var(--tbl-border-color);margin:0;border:0;overflow:auto;position:fixed;left:15%;top:10%;right:15%;bottom:15%;z-index:5000}.mdx-doc-lib>iframe{width:100%;height:100%;border:0;overflow:auto}.md-diagram-panel{margin-bottom:20px;padding:0}.mdx-interactive,rt:hover{cursor:pointer}.mdx-interactive.hover{border-color:#7735cc!important}.mdx-interactive.hover:active{box-shadow:0 0 0 2px rgba(119,53,204,.5);border-color:#7c5ba6!important;box-shadow:none;transform:none}.mdx-img-invert-dark{background-color:#fff!important;filter:var(--vlook-invert-dark);border-color:#c5c0b7!important}.mdx-figure-solid-bg-light{background:#fff}.mdx-figure-grid-line-light{background:url()!important}.mdx-figure-grid-block-light{background:url()!important}.mdx-figure-solid-bg-dark{background:#000}.mdx-figure-grid-line-dark{background:url()!important}.mdx-figure-grid-line-dark-invert{background:url()!important}.mdx-figure-grid-block-dark{background:url()!important}.mdx-figure-grid-block-dark-invert{background:url()!important}.mdx-figure-content{margin:5px;padding:5px;display:table-cell;align-content:center;text-align:center;vertical-align:middle;width:100%;color:var(--fore-color)}.mdx-figure-nav-title{color:#c0c4c8!important;left:10px;top:10px;position:absolute;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.mdx-caption>p,.mdx-figure-page-num,rp,rt{font-family:"VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif}.mdx-figure-page-num{border-radius:var(--vlook-small-radius);color:#fff;background-color:var(--fore-color-alt);padding-left:4px;padding-right:4px;font-size:.9em}.mdx-caption,.mdx-caption-container{border-radius:var(--vlook-base-radius)}.mdx-caption{display:inline-block;background-color:var(--doc-bg-color-alt)}.mdx-caption>p,rp,rt{font-weight:400}.mdx-caption>p{color:var(--fore-color);font-size:.85em;margin:5px 10px;width:auto!important}.mdx-caption hr{border-bottom:2px solid #737c8f;margin:.5em auto}.mdx-caption-container{margin-bottom:20px}use.mdx-svg-ico-alpha{fill:var(--fore-color);opacity:.2}use.mdx-svg-ico-theme{fill:var(--header-color)}use.mdx-svg-ico-alt{fill:var(--fore-color-alt)}use.mdx-blockquote-folder-ico,use.mdx-rowgroup-folder-ico,use.mdx-toc-folder-ico{fill:#00a8be}.mdx-mask{left:0;top:0;width:100%;height:100%;text-align:center;position:fixed;background-color:rgba(0,0,0,.6);display:none;z-index:1000}.mdx-mask.left{background:linear-gradient(90deg,#004e58 20%,rgba(0,78,88,.5))}.mdx-mask.right{background:linear-gradient(270deg,#004e58 20%,rgba(0,78,88,.5))}.mdx-mask.bottom{background:linear-gradient(0deg,#004e58 20%,rgba(0,78,88,.5))}.mdx-mask.center{background:radial-gradient(ellipse,#004e58 10%,rgba(0,78,88,.5))}.mdx-mask-close{position:fixed;justify-content:center;align-items:center;vertical-align:middle;width:60px;height:60px;opacity:.7}.mdx-mask-close.left,.mdx-mask-close.right{width:16px;height:60px}.mdx-mask-close.bottom{width:60px;height:16px}.mdx-backdrop-blurs.enabled{backdrop-filter:saturate(180%) blur(15px);-webkit-backdrop-filter:saturate(180%) blur(15px)}.mdx-quote-blue,.mdx-quote-brown,.mdx-quote-cyan,.mdx-quote-gray,.mdx-quote-green,.mdx-quote-orange,.mdx-quote-pink,.mdx-quote-purple,.mdx-quote-red,.mdx-quote-theme1,.mdx-quote-theme2,.mdx-quote-yellow{width:auto}.mdx-quote-red{background-color:var(--acc-color-red-fade)}.mdx-quote-red .mdx-std-code{background-color:var(--acc-color-red-alt)}.mdx-quote-red a kbd{background-color:var(--acc-color-red-light)!important}.mdx-quote-red a{border-color:#c72334}.mdx-quote-red a:hover{color:var(--fore-color)!important;box-shadow:0 -.3em 0 0 rgba(199,35,52,.3) inset}.mdx-quote-red a:active{background-color:var(--doc-bg-color-alt);box-shadow:0 0 0 2px rgba(199,35,52,.3);border-bottom:0;border-radius:var(--vlook-small-radius)}.mdx-quote-title-red{color:var(--acc-color-red-title)}.mdx-quote-orange{background-color:var(--acc-color-orange-fade)}.mdx-quote-orange .mdx-std-code{background-color:var(--acc-color-orange-alt)}.mdx-quote-orange a kbd{background-color:var(--acc-color-orange-light)!important}.mdx-quote-orange a{border-color:#e27d09}.mdx-quote-orange a:hover{color:var(--fore-color)!important;box-shadow:0 -.3em 0 0 rgba(226,125,9,.3) inset}.mdx-quote-orange a:active{background-color:var(--doc-bg-color-alt);box-shadow:0 0 0 2px rgba(226,125,9,.3);border-bottom:0;border-radius:var(--vlook-small-radius)}.mdx-quote-title-orange{color:var(--acc-color-orange-title)}.mdx-quote-yellow{background-color:var(--acc-color-yellow-fade)}.mdx-quote-yellow .mdx-std-code{background-color:var(--acc-color-yellow-alt)}.mdx-quote-yellow a kbd{background-color:var(--acc-color-yellow-light)!important}.mdx-quote-yellow a{border-color:#deb307}.mdx-quote-yellow a:hover{color:var(--fore-color)!important;box-shadow:0 -.3em 0 0 rgba(222,179,7,.3) inset}.mdx-quote-yellow a:active{background-color:var(--doc-bg-color-alt);box-shadow:0 0 0 2px rgba(222,179,7,.3);border-bottom:0;border-radius:var(--vlook-small-radius)}.mdx-quote-title-yellow{color:var(--acc-color-yellow-title)}.mdx-quote-green{background-color:var(--acc-color-green-fade)}.mdx-quote-green .mdx-std-code{background-color:var(--acc-color-green-alt)}.mdx-quote-green a kbd{background-color:var(--acc-color-green-light)!important}.mdx-quote-green a{border-color:#38ab21}.mdx-quote-green a:hover{color:var(--fore-color)!important;box-shadow:0 -.3em 0 0 rgba(56,171,33,.3) inset}.mdx-quote-green a:active{background-color:var(--doc-bg-color-alt);box-shadow:0 0 0 2px rgba(56,171,33,.3);border-bottom:0;border-radius:var(--vlook-small-radius)}.mdx-quote-title-green{color:var(--acc-color-green-title)}.mdx-quote-cyan{background-color:var(--acc-color-cyan-fade)}.mdx-quote-cyan .mdx-std-code{background-color:var(--acc-color-cyan-alt)}.mdx-quote-cyan a kbd{background-color:var(--acc-color-cyan-light)!important}.mdx-quote-cyan a{border-color:#18a8bf}.mdx-quote-cyan a:hover{color:var(--fore-color)!important;box-shadow:0 -.3em 0 0 rgba(24,168,191,.3) inset}.mdx-quote-cyan a:active{background-color:var(--doc-bg-color-alt);box-shadow:0 0 0 2px rgba(24,168,191,.3);border-bottom:0;border-radius:var(--vlook-small-radius)}.mdx-quote-title-cyan{color:var(--acc-color-cyan-title)}.mdx-quote-blue{background-color:var(--acc-color-blue-fade)}.mdx-quote-blue .mdx-std-code{background-color:var(--acc-color-blue-alt)}.mdx-quote-blue a kbd{background-color:var(--acc-color-blue-light)!important}.mdx-quote-blue a{border-color:#056bf0}.mdx-quote-blue a:hover{color:var(--fore-color)!important;box-shadow:0 -.3em 0 0 rgba(5,107,240,.3) inset}.mdx-quote-blue a:active{background-color:var(--doc-bg-color-alt);box-shadow:0 0 0 2px rgba(5,107,240,.3);border-bottom:0;border-radius:var(--vlook-small-radius)}.mdx-quote-title-blue{color:var(--acc-color-blue-title)}.mdx-quote-purple{background-color:var(--acc-color-purple-fade)}.mdx-quote-purple .mdx-std-code{background-color:var(--acc-color-purple-alt)}.mdx-quote-purple a kbd{background-color:var(--acc-color-purple-light)!important}.mdx-quote-purple a{border-color:#7738dc}.mdx-quote-purple a:hover{color:var(--fore-color)!important;box-shadow:0 -.3em 0 0 rgba(119,56,220,.3) inset}.mdx-quote-purple a:active{background-color:var(--doc-bg-color-alt);box-shadow:0 0 0 2px rgba(119,56,220,.3);border-bottom:0;border-radius:var(--vlook-small-radius)}.mdx-quote-title-purple{color:var(--acc-color-purple-title)}.mdx-quote-pink{background-color:var(--acc-color-pink-fade)}.mdx-quote-pink .mdx-std-code{background-color:var(--acc-color-pink-alt)}.mdx-quote-pink a kbd{background-color:var(--acc-color-pink-light)!important}.mdx-quote-pink a{border-color:#db43b2}.mdx-quote-pink a:hover{color:var(--fore-color)!important;box-shadow:0 -.3em 0 0 rgba(219,67,178,.3) inset}.mdx-quote-pink a:active{background-color:var(--doc-bg-color-alt);box-shadow:0 0 0 2px rgba(219,67,178,.3);border-bottom:0;border-radius:var(--vlook-small-radius)}.mdx-quote-title-pink{color:var(--acc-color-pink-title)}.mdx-quote-brown{background-color:var(--acc-color-brown-fade)}.mdx-quote-brown .mdx-std-code{background-color:var(--acc-color-brown-alt)}.mdx-quote-brown a kbd{background-color:var(--acc-color-brown-light)!important}.mdx-quote-brown a{border-color:#a47546}.mdx-quote-brown a:hover{color:var(--fore-color)!important;box-shadow:0 -.3em 0 0 rgba(164,117,70,.3) inset}.mdx-quote-brown a:active{background-color:var(--doc-bg-color-alt);box-shadow:0 0 0 2px rgba(164,117,70,.3);border-bottom:0;border-radius:var(--vlook-small-radius)}.mdx-quote-title-brown{color:var(--acc-color-brown-title)}.mdx-quote-gray{background-color:var(--acc-color-gray-fade)}.mdx-quote-gray .mdx-std-code{background-color:var(--acc-color-gray-alt)}.mdx-quote-gray a kbd{background-color:var(--acc-color-gray-light)!important}.mdx-quote-gray a{border-color:#7b7d82}.mdx-quote-gray a:hover{color:var(--fore-color)!important;box-shadow:0 -.3em 0 0 rgba(123,125,130,.3) inset}.mdx-quote-gray a:active{background-color:var(--doc-bg-color-alt);box-shadow:0 0 0 2px rgba(123,125,130,.3);border-bottom:0;border-radius:var(--vlook-small-radius)}.mdx-quote-title-gray{color:var(--acc-color-gray-title)}.mdx-quote-theme1{background-color:var(--acc-color-theme1-fade)}.mdx-quote-theme1 .mdx-std-code{background-color:var(--acc-color-theme1-alt)}.mdx-quote-theme1 a kbd{background-color:var(--acc-color-theme1-light)!important}.mdx-quote-theme1 a{border-color:#00a8be}.mdx-quote-theme1 a:hover{color:var(--fore-color)!important;box-shadow:0 -.3em 0 0 rgba(0,168,190,.3) inset}.mdx-quote-theme1 a:active{background-color:var(--doc-bg-color-alt);box-shadow:0 0 0 2px rgba(0,168,190,.3);border-bottom:0;border-radius:var(--vlook-small-radius)}.mdx-quote-title-theme1{color:var(--acc-color-theme1-title)}.mdx-quote-theme2{background-color:var(--acc-color-theme2-fade)}.mdx-quote-theme2 .mdx-std-code{background-color:var(--acc-color-theme2-alt)}.mdx-quote-theme2 a kbd{background-color:var(--acc-color-theme2-light)!important}.mdx-quote-theme2 a{border-color:#7735cc}.mdx-quote-theme2 a:hover{color:var(--fore-color)!important;box-shadow:0 -.3em 0 0 rgba(119,53,204,.3) inset}.mdx-quote-theme2 a:active{background-color:var(--doc-bg-color-alt);box-shadow:0 0 0 2px rgba(119,53,204,.3);border-bottom:0;border-radius:var(--vlook-small-radius)}.mdx-quote-title-theme2{color:var(--acc-color-theme2-title)}.mdx-tag-blue,.mdx-tag-brown,.mdx-tag-cyan,.mdx-tag-gray,.mdx-tag-green,.mdx-tag-orange,.mdx-tag-pink,.mdx-tag-purple,.mdx-tag-red,.mdx-tag-theme1,.mdx-tag-theme2,.mdx-tag-yellow{font-family:"VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif;font-weight:700;font-size:.9em;color:#fff;padding:.1em .5em;margin:0 .1em;white-space:pre;box-shadow:0 0 0 1px var(--code-name-shadow-color) inset}.mdx-tag-red{background:linear-gradient(135deg,var(--fore-color) .5em,var(--acc-color-red) .5em,var(--acc-color-red) 100%)}.mdx-tag-orange{background:linear-gradient(135deg,var(--fore-color) .5em,var(--acc-color-orange) .5em,var(--acc-color-orange) 100%)}.mdx-tag-yellow{background:linear-gradient(135deg,var(--fore-color) .5em,var(--acc-color-yellow) .5em,var(--acc-color-yellow) 100%)}.mdx-tag-green{background:linear-gradient(135deg,var(--fore-color) .5em,var(--acc-color-green) .5em,var(--acc-color-green) 100%)}.mdx-tag-cyan{background:linear-gradient(135deg,var(--fore-color) .5em,var(--acc-color-cyan) .5em,var(--acc-color-cyan) 100%)}.mdx-tag-blue{background:linear-gradient(135deg,var(--fore-color) .5em,var(--acc-color-blue) .5em,var(--acc-color-blue) 100%)}.mdx-tag-purple{background:linear-gradient(135deg,var(--fore-color) .5em,var(--acc-color-purple) .5em,var(--acc-color-purple) 100%)}.mdx-tag-pink{background:linear-gradient(135deg,var(--fore-color) .5em,var(--acc-color-pink) .5em,var(--acc-color-pink) 100%)}.mdx-tag-brown{background:linear-gradient(135deg,var(--fore-color) .5em,var(--acc-color-brown) .5em,var(--acc-color-brown) 100%)}.mdx-tag-gray{background:linear-gradient(135deg,var(--fore-color) .5em,var(--acc-color-gray) .5em,var(--acc-color-gray) 100%)}.mdx-tag-theme1{background:linear-gradient(135deg,var(--fore-color) .5em,var(--acc-color-theme1) .5em,var(--acc-color-theme1) 100%)}.mdx-tag-theme2{background:linear-gradient(135deg,var(--fore-color) .5em,var(--acc-color-theme2) .5em,var(--acc-color-theme2) 100%)}.mdx-tag-name-blue,.mdx-tag-name-brown,.mdx-tag-name-cyan,.mdx-tag-name-gray,.mdx-tag-name-green,.mdx-tag-name-orange,.mdx-tag-name-pink,.mdx-tag-name-purple,.mdx-tag-name-red,.mdx-tag-name-theme1,.mdx-tag-name-theme2,.mdx-tag-name-yellow{font-family:"VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif;font-weight:400;border-radius:var(--vlook-tag-radius) 0 0 var(--vlook-tag-radius);color:var(--doc-bg-color);background:var(--code-name-bg-color);padding:.1em .5em;margin:0 .1em;font-size:.9em;white-space:pre;box-shadow:0 0 0 1px var(--code-name-shadow-color) inset}.mdx-tag-value-blue,.mdx-tag-value-brown,.mdx-tag-value-cyan,.mdx-tag-value-gray,.mdx-tag-value-green,.mdx-tag-value-orange,.mdx-tag-value-pink,.mdx-tag-value-purple,.mdx-tag-value-red,.mdx-tag-value-theme1,.mdx-tag-value-theme2,.mdx-tag-value-yellow{font-family:"VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif;font-weight:700;border-radius:0 var(--vlook-tag-radius) var(--vlook-tag-radius) 0;color:#fff;padding:.1em .5em;margin:0 .1em .1em -.2em;box-shadow:0 0 0 1px var(--code-name-shadow-color) inset;font-size:.9em;white-space:pre}.mdx-tag-value-red{background-color:var(--acc-color-red)}.mdx-tag-value-orange{background-color:var(--acc-color-orange)}.mdx-tag-value-yellow{background-color:var(--acc-color-yellow)}.mdx-tag-value-green{background-color:var(--acc-color-green)}.mdx-tag-value-cyan{background-color:var(--acc-color-cyan)}.mdx-tag-value-blue{background-color:var(--acc-color-blue)}.mdx-tag-value-purple{background-color:var(--acc-color-purple)}.mdx-tag-value-pink{background-color:var(--acc-color-pink)}.mdx-tag-value-brown{background-color:var(--acc-color-brown)}.mdx-tag-value-gray{background-color:var(--acc-color-gray)}.mdx-tag-value-theme1{background-color:var(--acc-color-theme1)}.mdx-tag-value-theme2{background-color:var(--acc-color-theme2)}rp,rt{opacity:.6;padding-left:.5em;padding-right:.5em}rt:hover{color:#7735cc;opacity:1;box-shadow:0 -.4em 0 0 rgba(119,53,204,.3) inset;border-bottom:2px solid rgba(119,53,204,.3);transform-origin:center bottom;transform:scale(1.5)}.mdx-black-curtain{text-shadow:0 1px var(--fore-color);box-shadow:none;color:var(--doc-bg-color);font-size:1em;font-family:"VLOOK Sans Mono","Noto Sans Mono",Iosevka,"SF Mono",Menlo,"Cascadia Mono",Consolas,Courier,"Courier New","VLOOK Sans Mono","Noto Sans Mono",Iosevka,"SF Mono",Menlo,"Cascadia Mono",Consolas,Courier,"Courier New","VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","VLOOK Sans Mono","Noto Sans Mono",Iosevka,"SF Mono",Menlo,"Cascadia Mono",Consolas,Courier,"Courier New","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",monospace!important;font-weight:900;cursor:pointer}.mdx-black-curtain:hover{box-shadow:0 0 0 1px #7735cc,0 2px 0 0 #7735cc inset!important;display:inline-block;transform:scale(1.2)}.mdx-black-curtain-opened{box-shadow:0 0 0 1px var(--fore-color),0 2px 0 0 var(--fore-color) inset;background:var(--doc-bg-color)!important;text-shadow:none}.mdx-doc-title{color:#00a8be;font-size:2.5em;font-family:"VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif;font-weight:900;line-height:1.3!important;padding-top:70px;opacity:.5}.mdx-doc-title.mini{padding-top:10px}#write>h6:first-child,#write>h6:last-child,#write>pre.md-meta-block:first-child+h6{display:block;color:#c8f9ff!important;font-size:2.5em;font-family:"VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif;font-weight:900;text-align:center;filter:var(--vlook-brightness-dark);height:950px;padding:320px 60px 50px;margin:0 0 3em;border:0;border-radius:var(--vlook-base-radius);box-shadow:0 0 0 2px rgba(0,218,216,.2) inset;background-color:#00a8be;background-image:url(),url(),url(),url(),url();background-size:auto,auto,auto,auto,100%;background-repeat:no-repeat,no-repeat,no-repeat,no-repeat,repeat-y;background-position:top center,top center,bottom center,bottom center,center;line-height:1.3!important}#write>h6:last-child{height:550px;margin-top:3em;margin-bottom:0;padding:270px 60px 50px;color:#00dad8!important;text-align:center;background-color:#00a8be;background-image:url(),url(),url(),url(),url();background-size:auto,auto,auto,auto,100%;background-repeat:no-repeat,no-repeat,no-repeat,no-repeat,repeat-y;background-position:top center,top center,bottom center,bottom center,center}#write>h6:first-child em,#write>h6:first-child strong,#write>h6:first-child strong::before,#write>h6:first-child sub,#write>h6:first-child sup,#write>pre.md-meta-block:first-child+h6 em,#write>pre.md-meta-block:first-child+h6 strong,#write>pre.md-meta-block:first-child+h6 strong::before,#write>pre.md-meta-block:first-child+h6 sub,#write>pre.md-meta-block:first-child+h6 sup{color:#00dad8;font-family:"VLOOK Sans","Noto Sans CJK SC","Source Han Sans SC","思源黑体","Microsoft YaHei","微软雅黑",SimHei,"黑体","PingFang SC","PingFang TC","PingFang HK",sans-serif;font-weight:900}#write>h6:first-child .mdx-tag-blue,#write>h6:first-child .mdx-tag-cyan,#write>h6:first-child .mdx-tag-gray,#write>h6:first-child .mdx-tag-green,#write>h6:first-child .mdx-tag-name-blue,#write>h6:first-child .mdx-tag-name-brown,#write>h6:first-child .mdx-tag-name-cyan,#write>h6:first-child .mdx-tag-name-gray,#write>h6:first-child .mdx-tag-name-green,#write>h6:first-child .mdx-tag-name-orange,#write>h6:first-child .mdx-tag-name-pink,#write>h6:first-child .mdx-tag-name-purple,#write>h6:first-child .mdx-tag-name-red,#write>h6:first-child .mdx-tag-name-yellow,#write>h6:first-child .mdx-tag-orange,#write>h6:first-child .mdx-tag-pink #write>h6:first-child .mdx-tag-brown,#write>h6:first-child .mdx-tag-purple,#write>h6:first-child .mdx-tag-red,#write>h6:first-child .mdx-tag-value-blue,#write>h6:first-child .mdx-tag-value-brown,#write>h6:first-child .mdx-tag-value-cyan,#write>h6:first-child .mdx-tag-value-gray,#write>h6:first-child .mdx-tag-value-green,#write>h6:first-child .mdx-tag-value-orange,#write>h6:first-child .mdx-tag-value-pink,#write>h6:first-child .mdx-tag-value-purple,#write>h6:first-child .mdx-tag-value-red,#write>h6:first-child .mdx-tag-value-yellow,#write>h6:first-child .mdx-tag-yellow,#write>h6:first-child code,#write>pre.md-meta-block:first-child+h6 .mdx-tag-blue,#write>pre.md-meta-block:first-child+h6 .mdx-tag-cyan,#write>pre.md-meta-block:first-child+h6 .mdx-tag-gray,#write>pre.md-meta-block:first-child+h6 .mdx-tag-green,#write>pre.md-meta-block:first-child+h6 .mdx-tag-name-blue,#write>pre.md-meta-block:first-child+h6 .mdx-tag-name-brown,#write>pre.md-meta-block:first-child+h6 .mdx-tag-name-cyan,#write>pre.md-meta-block:first-child+h6 .mdx-tag-name-gray,#write>pre.md-meta-block:first-child+h6 .mdx-tag-name-green,#write>pre.md-meta-block:first-child+h6 .mdx-tag-name-orange,#write>pre.md-meta-block:first-child+h6 .mdx-tag-name-pink,#write>pre.md-meta-block:first-child+h6 .mdx-tag-name-purple,#write>pre.md-meta-block:first-child+h6 .mdx-tag-name-red,#write>pre.md-meta-block:first-child+h6 .mdx-tag-name-yellow,#write>pre.md-meta-block:first-child+h6 .mdx-tag-orange,#write>pre.md-meta-block:first-child+h6 .mdx-tag-pink #write>pre.md-meta-block:first-child+h6 .mdx-tag-brown,#write>pre.md-meta-block:first-child+h6 .mdx-tag-purple,#write>pre.md-meta-block:first-child+h6 .mdx-tag-red,#write>pre.md-meta-block:first-child+h6 .mdx-tag-value-blue,#write>pre.md-meta-block:first-child+h6 .mdx-tag-value-brown,#write>pre.md-meta-block:first-child+h6 .mdx-tag-value-cyan,#write>pre.md-meta-block:first-child+h6 .mdx-tag-value-gray,#write>pre.md-meta-block:first-child+h6 .mdx-tag-value-green,#write>pre.md-meta-block:first-child+h6 .mdx-tag-value-orange,#write>pre.md-meta-block:first-child+h6 .mdx-tag-value-pink,#write>pre.md-meta-block:first-child+h6 .mdx-tag-value-purple,#write>pre.md-meta-block:first-child+h6 .mdx-tag-value-red,#write>pre.md-meta-block:first-child+h6 .mdx-tag-value-yellow,#write>pre.md-meta-block:first-child+h6 .mdx-tag-yellow,#write>pre.md-meta-block:first-child+h6 code{font-size:.5em!important}#write>h6:first-child strong,#write>h6:first-child strong::before,#write>pre.md-meta-block:first-child+h6 strong,#write>pre.md-meta-block:first-child+h6 strong::before{font-size:.6em!important;font-weight:400!important}#write>h6:first-child strong::before,#write>pre.md-meta-block:first-child+h6 strong::before{content:"By "}#write>h6:first-child em,#write>pre.md-meta-block:first-child+h6 em{font-size:.4em;font-style:normal!important}@media screen and (min-height:801px){:root{--vlook-top-margin:-3px}.mdx-chapter-nav.mdx-float-card,.mdx-toolbar.mdx-float-card{top:10px!important;border-top-left-radius:var(--vlook-base-radius);border-top-right-radius:var(--vlook-base-radius)}.mdx-chapter-nav-prev.effect.hover,.mdx-chapter-nav-prev.effect::before,.mdx-chapter-nav-prev.noeffect.hover{border-top-left-radius:var(--vlook-base-radius)}.mdx-chapter-nav-next.effect.hover,.mdx-chapter-nav-next.effect::before,.mdx-chapter-nav-next.noeffect.hover{border-top-right-radius:var(--vlook-base-radius)}.mdx-nav-center-block{top:70px}}@media screen and (min-width:1441px){:root{--vlook-nav-center-width:400px;--vlook-nav-center-hidden-left:-410px;--vlook-toolbar-btn-width:40px}.md-hr+blockquote,.md-hr+blockquote+blockquote,hr+blockquote,hr+blockquote+blockquote{max-width:49.25%!important;min-width:49.25%!important}.md-hr+blockquote+blockquote,hr+blockquote+blockquote{margin-left:1.5%!important}.md-hr+.md-hr+blockquote,.md-hr+.md-hr+blockquote+blockquote,.md-hr+.md-hr+blockquote+blockquote+blockquote,hr+hr+blockquote,hr+hr+blockquote+blockquote,hr+hr+blockquote+blockquote+blockquote{max-width:32.34%!important;min-width:32.34%!important}.md-hr+.md-hr+blockquote+blockquote,.md-hr+.md-hr+blockquote+blockquote+blockquote,hr+hr+blockquote+blockquote,hr+hr+blockquote+blockquote+blockquote{margin-left:1.49%!important}.md-hr+.md-hr+.md-hr+blockquote,.md-hr+.md-hr+.md-hr+blockquote+blockquote,.md-hr+.md-hr+.md-hr+blockquote+blockquote+blockquote,.md-hr+.md-hr+.md-hr+blockquote+blockquote+blockquote+blockquote,hr+hr+hr+blockquote,hr+hr+hr+blockquote+blockquote,hr+hr+hr+blockquote+blockquote+blockquote,hr+hr+hr+blockquote+blockquote+blockquote+blockquote{max-width:23.875%!important;min-width:23.875%!important}.md-hr+.md-hr+.md-hr+blockquote+blockquote,.md-hr+.md-hr+.md-hr+blockquote+blockquote+blockquote,.md-hr+.md-hr+.md-hr+blockquote+blockquote+blockquote+blockquote,hr+hr+hr+blockquote+blockquote,hr+hr+hr+blockquote+blockquote+blockquote,hr+hr+hr+blockquote+blockquote+blockquote+blockquote{margin-left:1.5%!important}}@media screen and (max-width:1024px){.mdx-chapter-nav{left:20px!important}.mdx-chapter-nav-current,.mdx-chapter-nav-doc-title{margin-left:40px!important;margin-right:40px!important}.mdx-chapter-nav-next,.mdx-chapter-nav-prev{width:20%!important}.mdx-chapter-nav-next-text,.mdx-chapter-nav-prev-text{display:none!important}table{white-space:pre!important}#write>h6:first-child,#write>h6:last-child,#write>pre.md-meta-block:first-child+h6{font-size:2em!important}}@media screen and (min-width:641px) and (max-width:1023px){.mdx-welcome-page{font-size:1.25em!important}}@media screen and (min-width:361px) and (max-width:639px){.mdx-welcome-page{font-size:1.1em!important}}@media screen and (max-width:360px){.mdx-welcome-page{font-size:1em!important}}@media print{html{font-size:1em!important}#write{margin:20px!important}.mdx-doc-title{opacity:1}.mdx-table-cross,h1,h2,h3,h4,h5,h6{box-shadow:none!important;background:0 0!important}table:hover{border-color:var(--tbl-border-color)!important}.mdx-caption:hover{background-color:var(--doc-bg-color-alt)}.mdx-img-invert-dark{filter:none}#write .md-toc,blockquote{display:block!important}.mdx-bottom-tips,.mdx-btn-open-in-new-tab,.mdx-btn-outline,.mdx-chapter-nav,.mdx-info-tips,.mdx-link-error-list,.mdx-more-doc-content-after,.mdx-more-doc-content-before,.mdx-nav-center,.mdx-nav-center-body,.mdx-nav-center-header,.mdx-status-bar,.mdx-toc-handle,.mdx-tool-tips,.mdx-toolbar,.mdx-welcome-page{display:none!important;filter:none}.mdx-pg-current-item{box-shadow:none!important}.mdx-toc-item-current{background:0 0!important}.mdx-toc-item-current a{color:var(--fore-color)!important}.mdx-toc{display:block!important;visibility:visible!important}#write>h6:first-child,#write>h6:first-child em,#write>h6:first-child strong,#write>h6:first-child strong::before,#write>h6:first-child sub,#write>h6:first-child sup,#write>h6:last-child,#write>pre.md-meta-block:first-child+h6,#write>pre.md-meta-block:first-child+h6 em,#write>pre.md-meta-block:first-child+h6 strong,#write>pre.md-meta-block:first-child+h6 strong::before,#write>pre.md-meta-block:first-child+h6 sub,#write>pre.md-meta-block:first-child+h6 sup{background:#fff!important;color:#181a1e!important}}.mdx-color-scheme{color:#fff}@media (prefers-color-scheme:dark){.mdx-color-scheme{color:#000}:root{--vlook-color-scheme:dark;--vlook-invert-dark:invert(1) brightness(90%);--vlook-brightness-dark:brightness(90%);--bg-color:var(--doc-bg-color-dark);--side-bar-bg-color:var(--doc-bg-color-dark);--text-color:var(--fore-color-dark);--select-text-bg-color:rgba(0, 168, 190, 0.5);--control-text-color:var(--fore-color-dark);--control-text-hover-color:var(--fore-color-dark);--window-border:1px solid var(--doc-bg-color-alt-dark);--active-file-bg-color:var(--doc-bg-color-dark);--active-file-border-color:var(--select-text-bg-color);--active-file-text-color:var(--fore-color-dark);--item-hover-bg-color:var(--fore-color-alt-dark);--item-hover-text-color:var(--fore-color-dark);--primary-color:#00A8BE;--rawblock-edit-panel-bd:var(--doc-bg-color-dark);--search-select-bg-color:rgba(0, 168, 190, 0.5);--doc-bg-color:var(--doc-bg-color-dark);--doc-bg-color-alt:var(--doc-bg-color-alt-dark);--doc-bg-color-transparent:var(--doc-bg-color-transparent-dark);--doc-bg-color-alt-transparent:var(--doc-bg-color-alt-transparent-dark);--fore-color:var(--fore-color-dark);--fore-color-alt:var(--fore-color-alt-dark);--blockquote-bg:var(--blockquote-bg-dark);--tips-bg-color:var(--tips-bg-color-dark);--tips-bg-color-inset:var(--tips-bg-color-inset-dark);--a-color:var(--a-color-dark);--mark-color:var(--mark-color-dark);--tbl-header-color:var(--tbl-header-color-dark);--tbl-border-color:var(--tbl-border-color-dark);--tbl-th-bg-color:var(--tbl-th-bg-color-dark);--tbl-td-bg-color:var(--tbl-td-bg-color-dark);--tbl-cell-border-color:var(--tbl-cell-border-color-dark);--tbl-row-g-alpha:var(--tbl-row-g-alpha-dark);--del-color:var(--del-color-dark);--toc-header-num-color:var(--toc-header-num-color-dark);--header-color:var(--header-color-dark);--header-box-shadow:var(--header-box-shadow-dark);--header-bg-start-color:var(--header-bg-start-color-dark);--header-bg-end-color:var(--header-bg-end-color-dark);--code-bg-color:var(--code-bg-color-dark);--code-name-bg-color:var(--code-name-bg-color-dark);--code-name-shadow-color:var(--code-name-shadow-color-dark);--acc-color-red:var(--acc-color-red-dark);--acc-color-red-alt:var(--acc-color-red-alt-dark);--acc-color-red-fade:var(--acc-color-red-fade-dark);--acc-color-red-title:var(--acc-color-red-title-dark);--acc-color-orange:var(--acc-color-orange-dark);--acc-color-orange-alt:var(--acc-color-orange-alt-dark);--acc-color-orange-fade:var(--acc-color-orange-fade-dark);--acc-color-orange-title:var(--acc-color-orange-title-dark);--acc-color-yellow:var(--acc-color-yellow-dark);--acc-color-yellow-alt:var(--acc-color-yellow-alt-dark);--acc-color-yellow-fade:var(--acc-color-yellow-fade-dark);--acc-color-yellow-title:var(--acc-color-yellow-title-dark);--acc-color-green:var(--acc-color-green-dark);--acc-color-green-alt:var(--acc-color-green-alt-dark);--acc-color-green-fade:var(--acc-color-green-fade-dark);--acc-color-green-title:var(--acc-color-green-title-dark);--acc-color-cyan:var(--acc-color-cyan-dark);--acc-color-cyan-alt:var(--acc-color-cyan-alt-dark);--acc-color-cyan-fade:var(--acc-color-cyan-fade-dark);--acc-color-cyan-title:var(--acc-color-cyan-title-dark);--acc-color-blue:var(--acc-color-blue-dark);--acc-color-blue-alt:var(--acc-color-blue-alt-dark);--acc-color-blue-fade:var(--acc-color-blue-fade-dark);--acc-color-blue-title:var(--acc-color-blue-title-dark);--acc-color-purple:var(--acc-color-purple-dark);--acc-color-purple-alt:var(--acc-color-purple-alt-dark);--acc-color-purple-fade:var(--acc-color-purple-fade-dark);--acc-color-purple-title:var(--acc-color-purple-title-dark);--acc-color-pink:var(--acc-color-pink-dark);--acc-color-pink-alt:var(--acc-color-pink-alt-dark);--acc-color-pink-fade:var(--acc-color-pink-fade-dark);--acc-color-pink-title:var(--acc-color-pink-title-dark);--acc-color-brown:var(--acc-color-brown-dark);--acc-color-brown-alt:var(--acc-color-brown-alt-dark);--acc-color-brown-fade:var(--acc-color-brown-fade-dark);--acc-color-brown-title:var(--acc-color-brown-title-dark);--acc-color-gray:var(--acc-color-gray-dark);--acc-color-gray-alt:var(--acc-color-gray-alt-dark);--acc-color-gray-fade:var(--acc-color-gray-fade-dark);--acc-color-gray-title:var(--acc-color-gray-title-dark);--acc-color-theme1:var(--acc-color-theme1-dark);--acc-color-theme1-alt:var(--acc-color-theme1-alt-dark);--acc-color-theme1-fade:var(--acc-color-theme1-fade-dark);--acc-color-theme1-title:var(--acc-color-theme1-title-dark);--acc-color-theme2:var(--acc-color-theme2-dark);--acc-color-theme2-alt:var(--acc-color-theme2-alt-dark);--acc-color-theme2-fade:var(--acc-color-theme2-fade-dark);--acc-color-theme2-title:var(--acc-color-theme2-title-dark);--mm-color-red:var(--mm-color-red-dark);--mm-color-red-alt:var(--mm-color-red-alt-dark);--mm-color-orange:var(--mm-color-orange-dark);--mm-color-orange-alt:var(--mm-color-orange-alt-dark);--mm-color-yellow:var(--mm-color-yellow-dark);--mm-color-yellow-alt:var(--mm-color-yellow-alt-dark);--mm-color-green:var(--mm-color-green-dark);--mm-color-green-alt:var(--mm-color-green-alt-dark);--mm-color-cyan:var(--mm-color-cyan-dark);--mm-color-cyan-alt:var(--mm-color-cyan-alt-dark);--mm-color-blue:var(--mm-color-blue-dark);--mm-color-blue-alt:var(--mm-color-blue-alt-dark);--mm-color-purple:var(--mm-color-purple-dark);--mm-color-purple-alt:var(--mm-color-purple-alt-dark);--mm-color-pink:var(--mm-color-pink-dark);--mm-color-pink-alt:var(--mm-color-pink-alt-dark);--mm-color-brown:var(--mm-color-brown-dark);--mm-color-brown-alt:var(--mm-color-brown-alt-dark);--mm-color-gray:var(--mm-color-gray-dark);--mm-color-gray-alt:var(--mm-color-gray-alt-dark);--cm-keyword:var(--cm-keyword-dark);--cm-variable:var(--cm-variable-dark);--cm-variable-2:var(--cm-variable-2-dark);--cm-variable-3:var(--cm-variable-3-dark);--cm-tag:var(--cm-tag-dark);--cm-attribute:var(--cm-attribute-dark);--cm-CodeMirror-cursor:var(--cm-CodeMirror-cursor-dark);--cm-string:var(--cm-string-dark);--cm-string-2:var(--cm-string-2-dark);--cm-comment:var(--cm-comment-dark);--cm-header:var(--cm-header-dark);--cm-quote:var(--cm-quote-dark);--cm-hr:var(--cm-hr-dark);--cm-link:var(--cm-link-dark);--cm-negative:var(--cm-negative-dark);--cm-positive:var(--cm-positive-dark);--cm-meta:var(--cm-meta-dark);--cm-bulidin:var(--cm-buliddark);--cm-bracket:var(--cm-bracket-dark);--cm-atom:var(--cm-atom-dark);--cm-number:var(--cm-atom-dark)}img[src*="grid=line"],svg[data-inject-url*="grid=line"]{background:url()}img[src*="grid=block"],svg[data-inject-url*="grid=block"]{background:url()}img[src*="darksrc=invert"],svg[data-inject-url*="darksrc=invert"]{filter:var(--vlook-invert-dark);border-color:#c5c0b7!important;background:#fff}img[src*="darksrc=invert"][src*="grid=line"],svg[data-inject-url*="darksrc=invert"][data-inject-url*="grid=line"]{background:url()}[data-inject-url*="grid=block"],img[src*="darksrc=invert"][src*="grid=block"],svg[data-inject-url*="darksrc=invert"]{background:url()}.noteText tspan{fill:var(--fore-color-light)!important}}:root{--mm-font-family:"VLOOK Sans", "Noto Sans CJK SC", "Source Han Sans SC", "思源黑体", "Microsoft YaHei", "微软雅黑", SimHei, "黑体", "PingFang SC", "PingFang TC", "PingFang HK", sans-serif!important;--mm-alt-font-family:"VLOOK Sans", "Noto Sans CJK SC", "Source Han Sans SC", "思源黑体", "Microsoft YaHei", "微软雅黑", SimHei, "黑体", "PingFang SC", "PingFang TC", "PingFang HK", sans-serif!important}

 :root {--mermaid-font-zoom:1em ;}  @media print { @page {margin: 0 0 0 0;} body.typora-export {padding-left: 0; padding-right: 0;} #write {padding:0;}}
</style><title>Markdown 脚本化图表参考指南 - VLOOK™ / Markdown 编辑器 Typora 的主题包和增强插件</title>
</head>
<body class='typora-export'><div class='typora-export-content'>
<div id='write'  class=''><h6 id='vlook™br-让你的-markdown-有了新看wán法br-──br-脚本化图表参考指南br-br-br-max°孟兆br-copyright-©-2017-2021-max°design'><sub><span>VLOOK™</span></sub><br><span>让你的 Markdown 有了新</span><code>{看}(wán)</code><span>法</span><br><span>──</span><br><sup><span>脚本化图表参考指南</span></sup><br><br><br><strong><span>MAX°孟兆</span></strong><br><em><span>COPYRIGHT © 2017-2021. MAX°DESIGN.</span></em></h6><div class='md-toc' mdtype='toc'><p class="md-toc-content" role="list"><span role="listitem" class="md-toc-item md-toc-h6" data-ref="n2"><a class="md-toc-inner" href="#vlook™br-让你的-markdown-有了新看wán法br-──br-脚本化图表参考指南br-br-br-max°孟兆br-copyright-©-2017-2021-max°design">VLOOK™&lt;br /&gt;让你的 Markdown 有了新<code>{看}(wán)</code>法&lt;br /&gt;──&lt;br /&gt;脚本化图表参考指南&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;<strong>MAX°孟兆</strong>&lt;br /&gt;<em>COPYRIGHT © 2017-2021. MAX°DESIGN.</em></a></span><span role="listitem" class="md-toc-item md-toc-h1" data-ref="n4"><a class="md-toc-inner" href="#关于-markdown">关于 Markdown</a></span><span role="listitem" class="md-toc-item md-toc-h6" data-ref="n5"><a class="md-toc-inner" href="#markdown-是什么">Markdown 是什么？</a></span><span role="listitem" class="md-toc-item md-toc-h6" data-ref="n13"><a class="md-toc-inner" href="#markdown-语法参考">Markdown 语法参考：</a></span><span role="listitem" class="md-toc-item md-toc-h1" data-ref="n19"><a class="md-toc-inner" href="#主推方案-mermaid">主推方案 (Mermaid)</a></span><span role="listitem" class="md-toc-item md-toc-h2" data-ref="n23"><a class="md-toc-inner" href="#流程图">流程图</a></span><span role="listitem" class="md-toc-item md-toc-h6" data-ref="n24"><a class="md-toc-inner" href="#流程图以上的分支流程内容由下图进行接续）">![流程图]"（以上的「分支流程」内容由下图进行接续）"</a></span><span role="listitem" class="md-toc-item md-toc-h6" data-ref="n26"><a class="md-toc-inner" href="#分支流程接续上图）">分支流程（接续上图）</a></span><span role="listitem" class="md-toc-item md-toc-h6" data-ref="n28"><a class="md-toc-inner" href="#以上流程图的画图脚本示例">以上「流程图」的画图脚本示例</a></span><span role="listitem" class="md-toc-item md-toc-h6" data-ref="n30"><a class="md-toc-inner" href="#说明-1">说明</a></span><span role="listitem" class="md-toc-item md-toc-h2" data-ref="n72"><a class="md-toc-inner" href="#顺序图">顺序图</a></span><span role="listitem" class="md-toc-item md-toc-h6" data-ref="n73"><a class="md-toc-inner" href="#顺序图也称时序图--泳道图）">顺序图（也称：时序图 / 泳道图）</a></span><span role="listitem" class="md-toc-item md-toc-h6" data-ref="n75"><a class="md-toc-inner" href="#以上顺序图的画图脚本示例">以上「顺序图」的画图脚本示例</a></span><span role="listitem" class="md-toc-item md-toc-h6" data-ref="n77"><a class="md-toc-inner" href="#说明-2">说明</a></span><span role="listitem" class="md-toc-item md-toc-h2" data-ref="n109"><a class="md-toc-inner" href="#类图">类图</a></span><span role="listitem" class="md-toc-item md-toc-h6" data-ref="n111"><a class="md-toc-inner" href="#标准类图-1">标准类图 (1)</a></span><span role="listitem" class="md-toc-item md-toc-h6" data-ref="n113"><a class="md-toc-inner" href="#标准类图-2">标准类图 (2)</a></span><span role="listitem" class="md-toc-item md-toc-h6" data-ref="n115"><a class="md-toc-inner" href="#以上类图的画图脚本示例">以上「类图」的画图脚本示例</a></span><span role="listitem" class="md-toc-item md-toc-h2" data-ref="n117"><a class="md-toc-inner" href="#状态图">状态图</a></span><span role="listitem" class="md-toc-item md-toc-h3" data-ref="n118"><a class="md-toc-inner" href="#标准状态机图">标准状态机图</a></span><span role="listitem" class="md-toc-item md-toc-h6" data-ref="n119"><a class="md-toc-inner" href="#环境要求">环境要求</a></span><span role="listitem" class="md-toc-item md-toc-h6" data-ref="n125"><a class="md-toc-inner" href="#新版标准状态机图-1">新版标准状态机图 (1)</a></span><span role="listitem" class="md-toc-item md-toc-h6" data-ref="n127"><a class="md-toc-inner" href="#以上状态机图的画图脚本示例-1">以上「状态机图」的画图脚本示例</a></span><span role="listitem" class="md-toc-item md-toc-h6" data-ref="n129"><a class="md-toc-inner" href="#新版标准状态机图-2">新版标准状态机图 (2)</a></span><span role="listitem" class="md-toc-item md-toc-h6" data-ref="n131"><a class="md-toc-inner" href="#以上状态机图的画图脚本示例-2">以上「状态机图」的画图脚本示例</a></span><span role="listitem" class="md-toc-item md-toc-h3" data-ref="n133"><a class="md-toc-inner" href="#旧版状态图">旧版状态图</a></span><span role="listitem" class="md-toc-item md-toc-h6" data-ref="n134"><a class="md-toc-inner" href="#说明-3">说明</a></span><span role="listitem" class="md-toc-item md-toc-h6" data-ref="n153"><a class="md-toc-inner" href="#旧版状态机图兼容性较高）">旧版状态机图（兼容性较高）</a></span><span role="listitem" class="md-toc-item md-toc-h6" data-ref="n155"><a class="md-toc-inner" href="#以上状态机图的画图脚本示例-3">以上「状态机图」的画图脚本示例</a></span><span role="listitem" class="md-toc-item md-toc-h2" data-ref="n157"><a class="md-toc-inner" href="#甘特图">甘特图</a></span><span role="listitem" class="md-toc-item md-toc-h6" data-ref="n158"><a class="md-toc-inner" href="#甘特图示例">甘特图示例</a></span><span role="listitem" class="md-toc-item md-toc-h6" data-ref="n160"><a class="md-toc-inner" href="#以上甘特图的画图脚本示例">![以上「甘特图」的画图脚本示例]</a></span><span role="listitem" class="md-toc-item md-toc-h2" data-ref="n162"><a class="md-toc-inner" href="#饼图">饼图</a></span><span role="listitem" class="md-toc-item md-toc-h6" data-ref="n163"><a class="md-toc-inner" href="#q3-2019-中国线上智能手机市场主要品牌市场份额数据来自互联网">![Q3 2019 中国线上智能手机市场主要品牌市场份额]"数据来自：互联网"</a></span><span role="listitem" class="md-toc-item md-toc-h6" data-ref="n165"><a class="md-toc-inner" href="#以上饼图的画图脚本示例">以上「饼图」的画图脚本示例</a></span><span role="listitem" class="md-toc-item md-toc-h2" data-ref="n167"><a class="md-toc-inner" href="#实体关系图">实体关系图</a></span><span role="listitem" class="md-toc-item md-toc-h6" data-ref="n168"><a class="md-toc-inner" href="#实体关系图也称为er图）">实体关系图（也称为：ER图）</a></span><span role="listitem" class="md-toc-item md-toc-h2" data-ref="n170"><a class="md-toc-inner" href="#客户旅程地图">客户旅程地图</a></span><span role="listitem" class="md-toc-item md-toc-h6" data-ref="n171"><a class="md-toc-inner" href="#客户旅程地图也称用户体验地图）">客户旅程地图（也称：用户体验地图）</a></span><span role="listitem" class="md-toc-item md-toc-h1" data-ref="n173"><a class="md-toc-inner" href="#备选方案">备选方案</a></span><span role="listitem" class="md-toc-item md-toc-h2" data-ref="n175"><a class="md-toc-inner" href="#flowchartjs-流程图">flowchart.js (流程图)</a></span><span role="listitem" class="md-toc-item md-toc-h2" data-ref="n177"><a class="md-toc-inner" href="#js-sequence-diagrams-顺序图">JS Sequence Diagrams (顺序图)</a></span><span role="listitem" class="md-toc-item md-toc-h6" data-ref="n179"><a class="md-toc-inner" href="#the-end">The End </a></span></p></div><h1 id='关于-markdown'><span>关于 Markdown</span></h1><h6 id='markdown-是什么'><span>Markdown 是什么？</span></h6><ul><li><span>2004 年，</span><a href='https://en.wikipedia.org/wiki/John_Gruber'><span>John Gruber</span></a><span> 创造了 </span><a href='https://zh.wikipedia.org/wiki/Markdown'><img src="https://cdn.jsdelivr.net/gh/MadMaxChow/VLOOKres/pic/markdown-mark-solid.svg?mode=icon&amp;fill=text" referrerpolicy="no-referrer" alt="Markdown"><span> Markdown</span></a><span>，一种专门针对网络写作的 </span><code>文本标记语言</code><span>。使用 Markdown，你只需在写作过程中插入少量的标记符号，就能很轻松地进行排版（例如设置标题、加粗、列表、引用等）；</span></li><li><span>Markdown 文档以 </span><code>纯文本格式存储</code><span>，这意味着，它们可以用几乎任一种文本编辑器打开。同时，又能通过 Markdown 编辑器导出为带排版的富文本文档、HTML 网页等等。</span><mark><span>纯粹、简洁、易用、灵活</span></mark><span>，都是人们喜欢 Markdown 的原因；</span></li><li><span>目前 Markdown 的标准化项目是 </span><a href='http://commonmark.org'><span>CommonMark</span></a><span>。</span></li></ul><h6 id='markdown-语法参考'><span>Markdown 语法参考：</span></h6><ul><li><code>#推荐#</code><span> </span><strong><span>Github Flavored Markdown</span></strong><span> (GFM) 语法参考：Typora 目前采用该标准 </span><a href='https://support.typora.io/Markdown-Reference/'><span>详细</span></a><span>；</span></li><li><span>标准化 </span><strong><span>CommonMark</span></strong><span> 语法参考：</span><a href='http://commonmark.org/help/'><span>60 秒学会 Markdown 语法</span></a><span>、</span><a href='http://commonmark.org/help/tutorial/'><span>10 分钟深入学习 Markdown</span></a><span>。</span></li></ul><h1 id='主推方案-mermaid'><span>主推方案 (Mermaid)</span></h1><p><span>Mermaid 是一个用于画流程图、状态图、顺序图、甘特图的库，使用 JS 进行本地渲染，广泛集成于许多 Markdown 编辑器中。详见 </span><a href='https://mermaidjs.github.io'><span>Mermaid 官网</span></a><span>。</span></p><p><strong><span>目前 Typora + VLOOK™ 的最新版本，可支持下脚本化图表的制作和生成：</span></strong></p><p><a href='#流程图'><img src="https://cdn.jsdelivr.net/gh/MadMaxChow/VLOOKres/pic/dg-flowcharts.png?mode=frame&amp;inline=true&amp;srcset=@2x&amp;darksrc=invert" referrerpolicy="no-referrer" alt="流程图"></a><span>　　</span><a href='#顺序图'><img src="https://cdn.jsdelivr.net/gh/MadMaxChow/VLOOKres/pic/dg-seq.png?mode=frame&amp;inline=true&amp;srcset=@2x&amp;darksrc=invert" referrerpolicy="no-referrer" alt="顺序图"></a><span>　　</span><a href='#状态图'><img src="https://cdn.jsdelivr.net/gh/MadMaxChow/VLOOKres/pic/dg-state.png?mode=frame&amp;inline=true&amp;srcset=@2x&amp;darksrc=invert" referrerpolicy="no-referrer" alt="状态图"></a><span>　　</span><a href='#类图'><img src="https://cdn.jsdelivr.net/gh/MadMaxChow/VLOOKres/pic/dg-class.png?mode=frame&amp;inline=true&amp;srcset=@2x&amp;darksrc=invert" referrerpolicy="no-referrer" alt="类图"></a><span>　　</span><a href='#实体关系图'><img src="https://cdn.jsdelivr.net/gh/MadMaxChow/VLOOKres/pic/dg-er.png?mode=frame&amp;inline=true&amp;srcset=@2x&amp;darksrc=invert" referrerpolicy="no-referrer" alt="实体关系图"></a><span>　　</span><a href='#客户旅程地图'><img src="https://cdn.jsdelivr.net/gh/MadMaxChow/VLOOKres/pic/dg-uj.png?mode=frame&amp;inline=true&amp;srcset=@2x&amp;darksrc=invert" referrerpolicy="no-referrer" alt="客户旅程地图"></a><span>　　</span><a href='#甘特图'><img src="https://cdn.jsdelivr.net/gh/MadMaxChow/VLOOKres/pic/dg-gantt.png?mode=frame&amp;inline=true&amp;srcset=@2x&amp;darksrc=invert" referrerpolicy="no-referrer" alt="甘特图"></a><span>　　</span><a href='#饼图'><img src="https://cdn.jsdelivr.net/gh/MadMaxChow/VLOOKres/pic/dg-pie.png?mode=frame&amp;inline=true&amp;srcset=@2x&amp;darksrc=invert" referrerpolicy="no-referrer" alt="饼图"></a></p><h2 id='流程图'><span>流程图</span></h2><h6 id='流程图以上的分支流程内容由下图进行接续）'><span>![流程图]&quot;（以上的「分支流程」内容由下图进行接续）&quot;</span></h6><div class="md-diagram-panel md-fences-adv-panel"><svg id="mermaidChart0" width="100%" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" height="334.19989013671875" style="max-width: 847.3944091796875px;" viewBox="-8 -8 847.3944091796875 334.19989013671875" class="md-require-zoom-fix"><style>#mermaidChart0{font-family:sans-serif;font-size:16px;fill:#333;}#mermaidChart0 .error-icon{fill:#552222;}#mermaidChart0 .error-text{fill:#552222;stroke:#552222;}#mermaidChart0 .edge-thickness-normal{stroke-width:2px;}#mermaidChart0 .edge-thickness-thick{stroke-width:3.5px;}#mermaidChart0 .edge-pattern-solid{stroke-dasharray:0;}#mermaidChart0 .edge-pattern-dashed{stroke-dasharray:3;}#mermaidChart0 .edge-pattern-dotted{stroke-dasharray:2;}#mermaidChart0 .marker{fill:#333333;}#mermaidChart0 .marker.cross{stroke:#333333;}#mermaidChart0 svg{font-family:sans-serif;font-size:16px;}#mermaidChart0 .label{font-family:sans-serif;color:#333;}#mermaidChart0 .label text{fill:#333;}#mermaidChart0 .node rect,#mermaidChart0 .node circle,#mermaidChart0 .node ellipse,#mermaidChart0 .node polygon,#mermaidChart0 .node path{fill:#ECECFF;stroke:#9370DB;stroke-width:1px;}#mermaidChart0 .node .label{text-align:center;}#mermaidChart0 .node.clickable{cursor:pointer;}#mermaidChart0 .arrowheadPath{fill:#333333;}#mermaidChart0 .edgePath .path{stroke:#333333;stroke-width:1.5px;}#mermaidChart0 .flowchart-link{stroke:#333333;fill:none;}#mermaidChart0 .edgeLabel{background-color:#e8e8e8;text-align:center;}#mermaidChart0 .edgeLabel rect{opacity:0.5;background-color:#e8e8e8;fill:#e8e8e8;}#mermaidChart0 .cluster rect{fill:#ffffde;stroke:#aaaa33;stroke-width:1px;}#mermaidChart0 .cluster text{fill:#333;}#mermaidChart0 div.mermaidTooltip{position:absolute;text-align:center;max-width:200px;padding:2px;font-family:sans-serif;font-size:12px;background:hsl(80,100%,96.2745098039%);border:1px solid #aaaa33;border-radius:2px;pointer-events:none;z-index:100;}#mermaidChart0:root{--mermaid-font-family:sans-serif;}#mermaidChart0:root{--mermaid-alt-font-family:sans-serif;}#mermaidChart0 flowchart{fill:apa;}</style><g><g class="output"><g class="clusters"><g class="cluster" id="flowchart-子图-30" transform="translate(284.89805603027344,202.99993896484375)" style="opacity: 1;"><rect width="343.3960876464844" height="230.39990234375" x="-171.6980438232422" y="-115.199951171875"></rect><g class="label" transform="translate(0, -101.199951171875)" id="mermaidChart0Text"><g transform="translate(-17.600006103515625,-17.5999755859375)"><foreignObject width="35.20001220703125" height="35.199951171875"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; white-space: nowrap;">子图</div></foreignObject></g></g></g></g><g class="edgePaths"><g class="edgePath LS-START LE-node1" id="L-START-node1" style="opacity: 1;"><path class="path" d="M63.20001220703125,202.99993896484375L88.20001220703125,202.99993896484375L113.20001220703125,202.99993896484375L138.20001220703125,202.99993896484375" marker-end="url(#arrowhead48)" style="fill:none"></path><defs><marker id="arrowhead48" viewBox="0 0 10 10" refX="9" refY="5" markerUnits="strokeWidth" markerWidth="8" markerHeight="6" orient="auto"><path d="M 0 0 L 10 5 L 0 10 z" class="arrowheadPath" style="stroke-width: 1px; stroke-dasharray: 1px, 0px;"></path></marker></defs></g><g class="edgePath LS-node1 LE-groud1" id="L-node1-groud1" style="opacity: 1;"><path class="path" d="M228.60000610351562,177.35194643012025L276.0980529785156,150.39996337890625L323.5960998535156,150.39996337890625" marker-end="url(#arrowhead49)" style="fill:none"></path><defs><marker id="arrowhead49" viewBox="0 0 10 10" refX="9" refY="5" markerUnits="strokeWidth" markerWidth="8" markerHeight="6" orient="auto"><path d="M 0 0 L 10 5 L 0 10 z" class="arrowheadPath" style="stroke-width: 1px; stroke-dasharray: 1px, 0px;"></path></marker></defs></g><g class="edgePath LS-node1 LE-A1" id="L-node1-A1" style="opacity: 1;"><path class="path" d="M228.60000610351562,228.64793149956725L276.0980529785156,255.59991455078125L349.9961242675781,255.59991455078125" marker-end="url(#arrowhead50)" style="fill:none"></path><defs><marker id="arrowhead50" viewBox="0 0 10 10" refX="9" refY="5" markerUnits="strokeWidth" markerWidth="8" markerHeight="6" orient="auto"><path d="M 0 0 L 10 5 L 0 10 z" class="arrowheadPath" style="stroke-width: 1px; stroke-dasharray: 1px, 0px;"></path></marker></defs></g><g class="edgePath LS-groud1 LE-cond1" id="L-groud1-cond1" style="opacity: 1;"><path class="path" d="M431.5960998535156,150.39996337890625L456.5960998535156,150.39996337890625L516.7972717285156,150.39996337890625L587.0984191894531,150.89996337890625" marker-end="url(#arrowhead51)" style=" stroke-width: 3.5px;fill:none"></path><defs><marker id="arrowhead51" viewBox="0 0 10 10" refX="9" refY="5" markerUnits="strokeWidth" markerWidth="8" markerHeight="6" orient="auto"><path d="M 0 0 L 10 5 L 0 10 z" class="arrowheadPath" style="stroke-width: 1px; stroke-dasharray: 1px, 0px;"></path></marker></defs></g><g class="edgePath LS-cond1 LE-END" id="L-cond1-END" style="opacity: 1;"><path class="path" d="M615.6840542422491,143.48559843170224L679.6964416503906,97.79998779296875L758.5944671630859,62.38783416756682" marker-end="url(#arrowhead52)" style="fill:none"></path><defs><marker id="arrowhead52" viewBox="0 0 10 10" refX="9" refY="5" markerUnits="strokeWidth" markerWidth="8" markerHeight="6" orient="auto"><path d="M 0 0 L 10 5 L 0 10 z" class="arrowheadPath" style="stroke-width: 1px; stroke-dasharray: 1px, 0px;"></path></marker></defs></g><g class="edgePath LS-cond1 LE-page2" id="L-cond1-page2" style="opacity: 1;"><path class="path" d="M619.4945019389646,154.50388062939473L679.6964416503906,169.20001220703125L755.294464111328,169.70001220703125" marker-end="url(#arrowhead53)" style="fill:none;stroke-width:2px;stroke-dasharray:3;"></path><defs><marker id="arrowhead53" viewBox="0 0 10 10" refX="9" refY="5" markerUnits="strokeWidth" markerWidth="8" markerHeight="6" orient="auto"><path d="M 0 0 L 10 5 L 0 10 z" class="arrowheadPath" style="stroke-width: 1px; stroke-dasharray: 1px, 0px;"></path></marker></defs></g><g class="edgePath LS-A2 LE-END" id="L-A2-END" style="opacity: 1;"><path class="path" d="M632.1983947753906,35.5999755859375L679.6964416503906,35.5999755859375L758.5944671630859,46.26809288690739" marker-end="url(#arrowhead54)" style="fill:none"></path><defs><marker id="arrowhead54" viewBox="0 0 10 10" refX="9" refY="5" markerUnits="strokeWidth" markerWidth="8" markerHeight="6" orient="auto"><path d="M 0 0 L 10 5 L 0 10 z" class="arrowheadPath" style="stroke-width: 1px; stroke-dasharray: 1px, 0px;"></path></marker></defs></g></g><g class="edgeLabels"><g class="edgeLabel" transform="" style="opacity: 1;"><g transform="translate(0,0)" class="label"><rect rx="0" ry="0" width="0" height="0"></rect><foreignObject width="0" height="0"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; white-space: nowrap;"><span></span></div></foreignObject></g></g><g class="edgeLabel" transform="translate(276.0980529785156,150.39996337890625)" style="opacity: 1;"><g transform="translate(-22.498046875,-8.800048828125)" class="label"><rect rx="0" ry="0" width="44.99609375" height="17.60009765625"></rect><foreignObject width="44.99609375" height="17.60009765625"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; white-space: nowrap;"><span>情况1</span></div></foreignObject></g></g><g class="edgeLabel" transform="translate(276.0980529785156,255.59991455078125)" style="opacity: 1;"><g transform="translate(-22.498046875,-8.800048828125)" class="label"><rect rx="0" ry="0" width="44.99609375" height="17.60009765625"></rect><foreignObject width="44.99609375" height="17.60009765625"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; white-space: nowrap;"><span>情况2</span></div></foreignObject></g></g><g class="edgeLabel" transform="translate(516.7972717285156,150.39996337890625)" style="opacity: 1;"><g transform="translate(-35.201171875,-8.800048828125)" class="label"><rect rx="0" ry="0" width="70.40234375" height="17.60009765625"></rect><foreignObject width="70.40234375" height="17.60009765625"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; white-space: nowrap;"><span>重要分支</span></div></foreignObject></g></g><g class="edgeLabel" transform="translate(679.6964416503906,97.79998779296875)" style="opacity: 1;"><g transform="translate(-22.498046875,-8.800048828125)" class="label"><rect rx="0" ry="0" width="44.99609375" height="17.60009765625"></rect><foreignObject width="44.99609375" height="17.60009765625"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; white-space: nowrap;"><span>条件1</span></div></foreignObject></g></g><g class="edgeLabel" transform="translate(679.6964416503906,169.20001220703125)" style="opacity: 1;"><g transform="translate(-22.498046875,-8.800048828125)" class="label"><rect rx="0" ry="0" width="44.99609375" height="17.60009765625"></rect><foreignObject width="44.99609375" height="17.60009765625"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; white-space: nowrap;"><span>条件2</span></div></foreignObject></g></g><g class="edgeLabel" transform="" style="opacity: 1;"><g transform="translate(0,0)" class="label"><rect rx="0" ry="0" width="0" height="0"></rect><foreignObject width="0" height="0"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; white-space: nowrap;"><span></span></div></foreignObject></g></g></g><g class="nodes"><g class="node default" id="flowchart-groud1-18" transform="translate(377.5960998535156,150.39996337890625)" style="opacity: 1;"><rect rx="0" ry="0" x="-54" y="-27.5999755859375" width="108" height="55.199951171875" class="label-container"></rect><g class="label" transform="translate(0,0)"><g transform="translate(-44,-17.5999755859375)"><foreignObject width="88" height="35.199951171875"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; white-space: nowrap;">流程组节点</div></foreignObject></g></g></g><g class="node default" id="flowchart-node1-16" transform="translate(183.40000915527344,202.99993896484375)" style="opacity: 1;"><rect rx="5" ry="5" x="-45.19999694824219" y="-27.5999755859375" width="90.39999389648438" height="55.199951171875" class="label-container"></rect><g class="label" transform="translate(0,0)"><g transform="translate(-35.19999694824219,-17.5999755859375)"><foreignObject width="70.39999389648438" height="35.199951171875"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; white-space: nowrap;">普通节点</div></foreignObject></g></g></g><g class="node default" id="flowchart-A1-20" transform="translate(377.5960998535156,255.59991455078125)" style="opacity: 1;"><circle x="-15.869537353515625" y="-27.5999755859375" r="27.5999755859375" class="label-container"></circle><g class="label" transform="translate(0,0)"><g transform="translate(-5.869537353515625,-17.5999755859375)"><foreignObject width="11.73907470703125" height="35.199951171875"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; white-space: nowrap;">A</div></foreignObject></g></g></g><g class="node default" id="flowchart-START-15" transform="translate(35.600006103515625,202.99993896484375)" style="opacity: 1;"><rect rx="5" ry="5" x="-27.600006103515625" y="-27.5999755859375" width="55.20001220703125" height="55.199951171875" class="label-container"></rect><g class="label" transform="translate(0,0)"><g transform="translate(-17.600006103515625,-17.5999755859375)"><foreignObject width="35.20001220703125" height="35.199951171875"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; white-space: nowrap;">开始</div></foreignObject></g></g></g><g class="node default" id="flowchart-cond1-22" transform="translate(604.5984191894531,150.39996337890625)" style="opacity: 1;"><polygon points="18,0 36,-18 18,-36 0,-18" transform="translate(-18,18)" class="label-container"></polygon><g class="label" transform="translate(0,0)"><g transform="translate(0,0)"><foreignObject width="0" height="0"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; white-space: nowrap;"></div></foreignObject></g></g></g><g class="node default" id="flowchart-END-24" transform="translate(786.1944732666016,50)" style="opacity: 1;"><rect rx="5" ry="5" x="-27.600006103515625" y="-27.5999755859375" width="55.20001220703125" height="55.199951171875" class="label-container"></rect><g class="label" transform="translate(0,0)"><g transform="translate(-17.600006103515625,-17.5999755859375)"><foreignObject width="35.20001220703125" height="35.199951171875"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; white-space: nowrap;">结束</div></foreignObject></g></g></g><g class="node default" id="flowchart-page2-26" transform="translate(786.1944732666016,169.20001220703125)" style="opacity: 1;"><polygon points="-27.5999755859375,0 90.39999389648438,0 90.39999389648438,-55.199951171875 -27.5999755859375,-55.199951171875 0,-27.5999755859375" transform="translate(-45.19999694824219,27.5999755859375)" class="label-container"></polygon><g class="label" transform="translate(0,0)"><g transform="translate(-35.19999694824219,-17.5999755859375)"><foreignObject width="70.39999389648438" height="35.199951171875"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; white-space: nowrap;">分支流程</div></foreignObject></g></g></g><g class="node default" id="flowchart-A2-27" transform="translate(604.5984191894531,35.5999755859375)" style="opacity: 1;"><circle x="-15.869537353515625" y="-27.5999755859375" r="27.5999755859375" class="label-container"></circle><g class="label" transform="translate(0,0)"><g transform="translate(-5.869537353515625,-17.5999755859375)"><foreignObject width="11.73907470703125" height="35.199951171875"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; white-space: nowrap;">A</div></foreignObject></g></g></g></g></g></g></svg></div><h6 id='分支流程接续上图）'><span>分支流程（接续上图）</span></h6><div class="md-diagram-panel md-fences-adv-panel"><svg id="mermaidChart1" width="100%" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" height="79.2001953125" style="max-width: 393.400146484375px;" viewBox="-13.800048828125 -8 393.400146484375 79.2001953125" class="md-require-zoom-fix"><style>#mermaidChart1{font-family:sans-serif;font-size:16px;fill:#333;}#mermaidChart1 .error-icon{fill:#552222;}#mermaidChart1 .error-text{fill:#552222;stroke:#552222;}#mermaidChart1 .edge-thickness-normal{stroke-width:2px;}#mermaidChart1 .edge-thickness-thick{stroke-width:3.5px;}#mermaidChart1 .edge-pattern-solid{stroke-dasharray:0;}#mermaidChart1 .edge-pattern-dashed{stroke-dasharray:3;}#mermaidChart1 .edge-pattern-dotted{stroke-dasharray:2;}#mermaidChart1 .marker{fill:#333333;}#mermaidChart1 .marker.cross{stroke:#333333;}#mermaidChart1 svg{font-family:sans-serif;font-size:16px;}#mermaidChart1 .label{font-family:sans-serif;color:#333;}#mermaidChart1 .label text{fill:#333;}#mermaidChart1 .node rect,#mermaidChart1 .node circle,#mermaidChart1 .node ellipse,#mermaidChart1 .node polygon,#mermaidChart1 .node path{fill:#ECECFF;stroke:#9370DB;stroke-width:1px;}#mermaidChart1 .node .label{text-align:center;}#mermaidChart1 .node.clickable{cursor:pointer;}#mermaidChart1 .arrowheadPath{fill:#333333;}#mermaidChart1 .edgePath .path{stroke:#333333;stroke-width:1.5px;}#mermaidChart1 .flowchart-link{stroke:#333333;fill:none;}#mermaidChart1 .edgeLabel{background-color:#e8e8e8;text-align:center;}#mermaidChart1 .edgeLabel rect{opacity:0.5;background-color:#e8e8e8;fill:#e8e8e8;}#mermaidChart1 .cluster rect{fill:#ffffde;stroke:#aaaa33;stroke-width:1px;}#mermaidChart1 .cluster text{fill:#333;}#mermaidChart1 div.mermaidTooltip{position:absolute;text-align:center;max-width:200px;padding:2px;font-family:sans-serif;font-size:12px;background:hsl(80,100%,96.2745098039%);border:1px solid #aaaa33;border-radius:2px;pointer-events:none;z-index:100;}#mermaidChart1:root{--mermaid-font-family:sans-serif;}#mermaidChart1:root{--mermaid-alt-font-family:sans-serif;}#mermaidChart1 flowchart{fill:apa;}</style><g><g class="output"><g class="clusters"></g><g class="edgePaths"><g class="edgePath LS-page2 LE-node2" id="L-page2-node2" style="opacity: 1;"><path class="path" d="M126.50009155273438,36.10009765625L151.00009155273438,35.60009765625L176.00009155273438,35.60009765625" marker-end="url(#arrowhead66)" style="fill:none"></path><defs><marker id="arrowhead66" viewBox="0 0 10 10" refX="9" refY="5" markerUnits="strokeWidth" markerWidth="8" markerHeight="6" orient="auto"><path d="M 0 0 L 10 5 L 0 10 z" class="arrowheadPath" style="stroke-width: 1px; stroke-dasharray: 1px, 0px;"></path></marker></defs></g><g class="edgePath LS-node2 LE-END" id="L-node2-END" style="opacity: 1;"><path class="path" d="M266.40008544921875,35.60009765625L291.40008544921875,35.60009765625L316.40008544921875,35.60009765625" marker-end="url(#arrowhead67)" style="fill:none"></path><defs><marker id="arrowhead67" viewBox="0 0 10 10" refX="9" refY="5" markerUnits="strokeWidth" markerWidth="8" markerHeight="6" orient="auto"><path d="M 0 0 L 10 5 L 0 10 z" class="arrowheadPath" style="stroke-width: 1px; stroke-dasharray: 1px, 0px;"></path></marker></defs></g></g><g class="edgeLabels"><g class="edgeLabel" transform="" style="opacity: 1;"><g transform="translate(0,0)" class="label"><rect rx="0" ry="0" width="0" height="0"></rect><foreignObject width="0" height="0"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; white-space: nowrap;"><span></span></div></foreignObject></g></g><g class="edgeLabel" transform="" style="opacity: 1;"><g transform="translate(0,0)" class="label"><rect rx="0" ry="0" width="0" height="0"></rect><foreignObject width="0" height="0"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; white-space: nowrap;"><span></span></div></foreignObject></g></g></g><g class="nodes"><g class="node default" id="flowchart-page2-36" transform="translate(67.00004577636719,35.60009765625)" style="opacity: 1;"><polygon points="-27.60009765625,0 90.39999389648438,0 90.39999389648438,-55.2001953125 -27.60009765625,-55.2001953125 0,-27.60009765625" transform="translate(-45.19999694824219,27.60009765625)" class="label-container"></polygon><g class="label" transform="translate(0,0)"><g transform="translate(-35.19999694824219,-17.60009765625)"><foreignObject width="70.39999389648438" height="35.2001953125"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; white-space: nowrap;">分支流程</div></foreignObject></g></g></g><g class="node default" id="flowchart-node2-37" transform="translate(221.20008850097656,35.60009765625)" style="opacity: 1;"><rect rx="5" ry="5" x="-45.19999694824219" y="-27.60009765625" width="90.39999389648438" height="55.2001953125" class="label-container"></rect><g class="label" transform="translate(0,0)"><g transform="translate(-35.19999694824219,-17.60009765625)"><foreignObject width="70.39999389648438" height="35.2001953125"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; white-space: nowrap;">普通节点</div></foreignObject></g></g></g><g class="node default" id="flowchart-END-39" transform="translate(344.0000915527344,35.60009765625)" style="opacity: 1;"><rect rx="5" ry="5" x="-27.600006103515625" y="-27.60009765625" width="55.20001220703125" height="55.2001953125" class="label-container"></rect><g class="label" transform="translate(0,0)"><g transform="translate(-17.600006103515625,-17.60009765625)"><foreignObject width="35.20001220703125" height="35.2001953125"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; white-space: nowrap;">结束</div></foreignObject></g></g></g></g></g></g></svg></div><h6 id='以上流程图的画图脚本示例'><span>以上「流程图」的画图脚本示例</span></h6><pre class="md-fences md-end-block md-fences-with-lineno ty-contain-cm modeLoaded" spellcheck="false" lang="" style="break-inside: unset;"><div class="CodeMirror cm-s-inner cm-s-null-scroll CodeMirror-wrap" lang=""><div style="overflow: hidden; position: relative; width: 3px; height: 0px; top: 12.545454025268555px; left: 40.99432373046875px;"><textarea autocorrect="off" autocapitalize="off" spellcheck="false" tabindex="0" style="position: absolute; bottom: -1em; padding: 0px; width: 1000px; height: 1em; outline: none;"></textarea></div><div class="CodeMirror-scrollbar-filler" cm-not-content="true"></div><div class="CodeMirror-gutter-filler" cm-not-content="true"></div><div class="CodeMirror-scroll" tabindex="-1"><div class="CodeMirror-sizer" style="margin-left: 31px; margin-bottom: 0px; border-right-width: 0px; padding-right: 0px; padding-bottom: 0px;"><div style="position: relative; top: 0px;"><div class="CodeMirror-lines" role="presentation"><div role="presentation" style="position: relative; outline: none;"><div class="CodeMirror-measure"><div class="CodeMirror-linenumber CodeMirror-gutter-elt"><div>14</div></div></div><div class="CodeMirror-measure"></div><div style="position: relative; z-index: 1;"></div><div class="CodeMirror-code" role="presentation" style=""><div class="CodeMirror-activeline" style="position: relative;"><div class="CodeMirror-activeline-background CodeMirror-linebackground"></div><div class="CodeMirror-gutter-background CodeMirror-activeline-gutter" style="left: -30.99432373046875px; width: 31px;"></div><div class="CodeMirror-gutter-wrapper CodeMirror-activeline-gutter" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt CodeMirror-linenumber-show" style="left: 0px; width: 22px;">1</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">graph LR</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">2</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">START(开始) --&gt; node1(普通节点)</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">3</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">subgraph 子图</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">4</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"><span class="cm-tab" role="presentation" cm-text="	">  </span>node1 --&gt; |情况1|groud1[流程组节点]</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">5</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">  node1 --&gt; |情况2|A1((A))</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">6</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">end</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">7</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"><span cm-text="" cm-zwsp="">
</span></span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">8</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">%% this is a comment</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">9</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"><span cm-text="" cm-zwsp="">
</span></span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt CodeMirror-linenumber-show" style="left: 0px; width: 22px;">10</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">groud1 ==&gt; |重要分支|cond1{条件判断}</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">11</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">cond1 --&gt; |是|END</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">12</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">cond1 -.-&gt; |否|page2&gt;分支流程]</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">13</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">A2((A)) --&gt; END</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt CodeMirror-linenumber-show" style="left: 0px; width: 22px;">14</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">END(结束)</span></pre></div></div></div></div></div></div><div style="position: absolute; height: 0px; width: 1px; border-bottom-width: 0px; border-bottom-style: solid; border-bottom-color: transparent; top: 408px;"></div><div class="CodeMirror-gutters" style="height: 408px; left: 0.00567626953125px;"><div class="CodeMirror-gutter CodeMirror-linenumbers" style="width: 30px;"></div></div></div></div></pre><h6 id='说明-1'><span>说明</span></h6><ol start='' ><li><p><span>针对流程图及不同图元的应用，重绘为不同的外观、形状；</span></p></li><li><p><span>特定节点命名规范：</span></p><ul><li><code>START</code><span>：开始结点</span></li><li><code>END</code><span>：结束结点</span></li></ul></li><li><p><span>支持节点形状/类型：</span></p><figure><table><thead><tr><th style='text-align:center;' ><strong><span>节点形状</span></strong></th><th style='text-align:left;' ><span>应用建议</span></th><th><span>说明</span></th></tr></thead><tbody><tr><td style='text-align:center;' ><span>圆角矩形</span></td><td style='text-align:left;' ><span>普通流程节点</span></td><td><span>结合别名（如：node1、page2 等，可自由定义），并通过</span><code>()</code><span>指定，举例：</span><code>node1(普通节点)</code></td></tr><tr><td style='text-align:center;' ><span>菱形</span></td><td style='text-align:left;' ><span>条件判断节点</span></td><td><span>结合别名，并通过</span><code>{}</code><span>指定，举例：</span><code>cond1{条件判断}</code><br><code>#注意#</code><span>「条件判断节点」的别名建议统一以</span><code>cond</code><span>为前缀</span></td></tr><tr><td style='text-align:center;' ><span>方角矩形</span></td><td style='text-align:left;' ><span>普通流程节点/子流程/状态图</span></td><td><span>不使用别名时的默认样式，也可以通过</span><code>[]</code><span>来强制指定，举例：</span><code>node1[流程组]</code></td></tr><tr><td style='text-align:center;' ><span>圆形</span></td><td style='text-align:left;' ><span>同页标志</span></td><td><span>结合别名，并通过</span><code>(())</code><span>指定，举例：</span><code>node1((圆形节点)</code></td></tr><tr><td style='text-align:center;' ><span>旗形</span></td><td style='text-align:left;' ><span>离页标志</span></td><td><span>结合别名，并通过</span><code>&gt;]</code><span>指定，举例：</span><code>page1&gt;条件判断节点]</code><br><code>#注意#</code><span>「离页标志节点」的别名必须以</span><code>page</code><span>为前缀，否则样式会与「菱形」条件判断节点冲突</span></td></tr></tbody></table></figure></li><li><p><span>支持指定流程图方向：</span><code>LR</code><span>（从左到右）、</span><code>RL</code><span>（从右到左）、</span><code>TB</code><span>（从上到下）、</span><code>BT</code><span>（从下到上）；</span></p></li><li><p><span>支持 FontAwesome </span><a href='http://fontawesome.com'><span>官网</span></a><span>。</span></p></li></ol><h2 id='顺序图'><span>顺序图</span></h2><h6 id='顺序图也称时序图--泳道图）'><span>顺序图（也称：时序图 / 泳道图）</span></h6><div class="md-diagram-panel md-fences-adv-panel"><svg id="mermaidChart2" width="866" xmlns="http://www.w3.org/2000/svg" height="1108" viewBox="-8 -8 866 1108" class="md-require-zoom-fix"><rect x="592" y="348" fill="rgba(128, 128, 128, 0.3)" width="166" height="122" class="rect"></rect><style>#mermaidChart2{font-family:sans-serif;font-size:16px;fill:#333;}#mermaidChart2 .error-icon{fill:#552222;}#mermaidChart2 .error-text{fill:#552222;stroke:#552222;}#mermaidChart2 .edge-thickness-normal{stroke-width:2px;}#mermaidChart2 .edge-thickness-thick{stroke-width:3.5px;}#mermaidChart2 .edge-pattern-solid{stroke-dasharray:0;}#mermaidChart2 .edge-pattern-dashed{stroke-dasharray:3;}#mermaidChart2 .edge-pattern-dotted{stroke-dasharray:2;}#mermaidChart2 .marker{fill:#333333;}#mermaidChart2 .marker.cross{stroke:#333333;}#mermaidChart2 svg{font-family:sans-serif;font-size:16px;}#mermaidChart2 .actor{stroke:hsl(259.6261682243,59.7765363128%,87.9019607843%);fill:#ECECFF;}#mermaidChart2 text.actor &gt; tspan{fill:black;stroke:none;}#mermaidChart2 .actor-line{stroke:grey;}#mermaidChart2 .messageLine0{stroke-width:1.5;stroke-dasharray:none;stroke:#333;}#mermaidChart2 .messageLine1{stroke-width:1.5;stroke-dasharray:2,2;stroke:#333;}#mermaidChart2 #arrowhead path{fill:#333;stroke:#333;}#mermaidChart2 .sequenceNumber{fill:white;}#mermaidChart2 #sequencenumber{fill:#333;}#mermaidChart2 #crosshead path{fill:#333;stroke:#333;}#mermaidChart2 .messageText{fill:#333;stroke:#333;}#mermaidChart2 .labelBox{stroke:hsl(259.6261682243,59.7765363128%,87.9019607843%);fill:#ECECFF;}#mermaidChart2 .labelText,#mermaidChart2 .labelText &gt; tspan{fill:black;stroke:none;}#mermaidChart2 .loopText,#mermaidChart2 .loopText &gt; tspan{fill:black;stroke:none;}#mermaidChart2 .loopLine{stroke-width:2px;stroke-dasharray:2,2;stroke:hsl(259.6261682243,59.7765363128%,87.9019607843%);fill:hsl(259.6261682243,59.7765363128%,87.9019607843%);}#mermaidChart2 .note{stroke:#aaaa33;fill:#fff5ad;}#mermaidChart2 .noteText,#mermaidChart2 .noteText &gt; tspan{fill:black;stroke:none;}#mermaidChart2 .activation0{fill:#f4f4f4;stroke:#666;}#mermaidChart2 .activation1{fill:#f4f4f4;stroke:#666;}#mermaidChart2 .activation2{fill:#f4f4f4;stroke:#666;}#mermaidChart2:root{--mermaid-font-family:sans-serif;}#mermaidChart2:root{--mermaid-alt-font-family:sans-serif;}#mermaidChart2 sequence{fill:apa;}</style><g></g><g><line id="actor0" x1="75" y1="5" x2="75" y2="1099" class="actor-line" stroke-width="0.5px" stroke="#999"></line><rect x="0" y="0" fill="#eaeaea" stroke="#666" width="150" height="65" rx="3" ry="3" class="actor"></rect><text x="75" y="32.5" dominant-baseline="central" alignment-baseline="central" class="actor" style="text-anchor: middle; font-size: 14px; font-weight: 400; font-family: Open-Sans, sans-serif;"><tspan x="75" dy="0">@人物角色</tspan></text></g><g><line id="actor1" x1="275" y1="5" x2="275" y2="1099" class="actor-line" stroke-width="0.5px" stroke="#999"></line><rect x="200" y="0" fill="#eaeaea" stroke="#666" width="150" height="65" rx="3" ry="3" class="actor"></rect><text x="275" y="32.5" dominant-baseline="central" alignment-baseline="central" class="actor" style="text-anchor: middle; font-size: 14px; font-weight: 400; font-family: Open-Sans, sans-serif;"><tspan x="275" dy="0">系统角色</tspan></text></g><g><line id="actor2" x1="475" y1="5" x2="475" y2="1099" class="actor-line" stroke-width="0.5px" stroke="#999"></line><rect x="400" y="0" fill="#eaeaea" stroke="#666" width="150" height="65" rx="3" ry="3" class="actor"></rect><text x="475" y="32.5" dominant-baseline="central" alignment-baseline="central" class="actor" style="text-anchor: middle; font-size: 14px; font-weight: 400; font-family: Open-Sans, sans-serif;"><tspan x="475" dy="0">**重要系统角色</tspan></text></g><g><line id="actor3" x1="675" y1="5" x2="675" y2="1099" class="actor-line" stroke-width="0.5px" stroke="#999"></line><rect x="600" y="0" fill="#eaeaea" stroke="#666" width="150" height="65" rx="3" ry="3" class="actor"></rect><text x="675" y="32.5" dominant-baseline="central" alignment-baseline="central" class="actor" style="text-anchor: middle; font-size: 14px; font-weight: 400; font-family: Open-Sans, sans-serif;"><tspan x="675" dy="0">--外部系统角色</tspan></text></g><defs><marker id="arrowhead" refX="5" refY="2" markerWidth="6" markerHeight="4" orient="auto"><path d="M 0,0 V 4 L6,2 Z"></path></marker></defs><defs><marker id="crosshead" markerWidth="15" markerHeight="8" orient="auto" refX="16" refY="4"><path fill="black" stroke="#000000" stroke-width="1px" d="M 9,2 V 6 L16,4 Z" style="stroke-dasharray: 0px, 0px;"></path><path fill="none" stroke="#000000" stroke-width="1px" d="M 0,1 L 6,7 M 6,1 L 0,7" style="stroke-dasharray: 0px, 0px;"></path></marker></defs><defs><marker id="sequencenumber" refX="15" refY="15" markerWidth="60" markerHeight="40" orient="auto"><circle cx="15" cy="15" r="6"></circle></marker></defs><text x="175" y="121" text-anchor="middle" dominant-baseline="middle" alignment-baseline="middle" class="messageText" dy="1em" style="font-family: &quot;trebuchet ms&quot;, verdana, arial; font-size: 16px; font-weight: 400;">平行发送消息1</text><line x1="75" y1="152" x2="275" y2="152" class="messageLine0" stroke-width="2" stroke="none" marker-end="url(#arrowhead)" marker-start="url(#sequencenumber)" style="fill: none;"></line><text x="75" y="156" font-family="sans-serif" font-size="12px" text-anchor="middle" textLength="16px" class="sequenceNumber">1</text><text x="175" y="188" text-anchor="middle" dominant-baseline="middle" alignment-baseline="middle" class="messageText" dy="1em" style="font-family: &quot;trebuchet ms&quot;, verdana, arial; font-size: 16px; font-weight: 400;">平行发送消息2</text><line x1="75" y1="219" x2="275" y2="219" class="messageLine0" stroke-width="2" stroke="none" marker-end="url(#arrowhead)" marker-start="url(#sequencenumber)" style="fill: none;"></line><text x="75" y="223" font-family="sans-serif" font-size="12px" text-anchor="middle" textLength="16px" class="sequenceNumber">2</text><text x="375" y="255" text-anchor="middle" dominant-baseline="middle" alignment-baseline="middle" class="messageText" dy="1em" style="font-family: &quot;trebuchet ms&quot;, verdana, arial; font-size: 16px; font-weight: 400;">平行发送消息3</text><line x1="275" y1="286" x2="475" y2="286" class="messageLine0" stroke-width="2" stroke="none" marker-end="url(#arrowhead)" marker-start="url(#sequencenumber)" style="fill: none;"></line><text x="275" y="290" font-family="sans-serif" font-size="12px" text-anchor="middle" textLength="16px" class="sequenceNumber">3</text><g><rect x="470" y="286" fill="#EDF2AE" stroke="#666" width="10" height="46" rx="0" ry="0" class="activation0"></rect></g><text x="373" y="301" text-anchor="middle" dominant-baseline="middle" alignment-baseline="middle" class="messageText" dy="1em" style="font-family: &quot;trebuchet ms&quot;, verdana, arial; font-size: 16px; font-weight: 400;">发送消息</text><line x1="470" y1="332" x2="275" y2="332" class="messageLine1" stroke-width="2" stroke="none" marker-end="url(#arrowhead)" marker-start="url(#sequencenumber)" style="stroke-dasharray: 3px, 3px; fill: none;"></line><text x="470" y="336" font-family="sans-serif" font-size="12px" text-anchor="middle" textLength="16px" class="sequenceNumber">4</text><g><line x1="67" y1="73" x2="488" y2="73" class="loopLine"></line><line x1="488" y1="73" x2="488" y2="340" class="loopLine"></line><line x1="67" y1="340" x2="488" y2="340" class="loopLine"></line><line x1="67" y1="73" x2="67" y2="340" class="loopLine"></line><line x1="67" y1="165" x2="488" y2="165" class="loopLine" style="stroke-dasharray: 3px, 3px;"></line><line x1="67" y1="232" x2="488" y2="232" class="loopLine" style="stroke-dasharray: 3px, 3px;"></line><polygon points="67,73 117,73 117,86 108.6,93 67,93" class="labelBox"></polygon><text x="92" y="86" text-anchor="middle" dominant-baseline="middle" alignment-baseline="middle" class="labelText" style="font-family: &quot;trebuchet ms&quot;, verdana, arial; font-size: 16px; font-weight: 400;">par</text><text x="302.5" y="89" text-anchor="middle" class="loopText" style="font-family: &quot;trebuchet ms&quot;, verdana, arial; font-size: 16px; font-weight: 400;"><tspan x="302.5">[平行消息]</tspan></text></g><text x="675" y="371" text-anchor="middle" dominant-baseline="middle" alignment-baseline="middle" class="messageText" dy="1em" style="font-family: &quot;trebuchet ms&quot;, verdana, arial; font-size: 16px; font-weight: 400;">内部动作</text><path d="M 675,402 C 735,392 735,432 675,422" class="messageLine0" stroke-width="2" stroke="none" marker-end="url(#arrowhead)" marker-start="url(#sequencenumber)" style="fill: none;"></path><text x="675" y="406" font-family="sans-serif" font-size="12px" text-anchor="middle" textLength="16px" class="sequenceNumber">5</text><g><rect x="500" y="478" fill="#EDF2AE" stroke="#666" width="150" height="57" rx="0" ry="0" class="note"></rect><text x="575" y="483" text-anchor="middle" dominant-baseline="middle" alignment-baseline="middle" class="noteText" dy="1em" style="font-family: &quot;trebuchet ms&quot;, verdana, arial; font-size: 14px; font-weight: 400;"><tspan x="575">显示在外部系统</tspan></text><text x="575" y="501" text-anchor="middle" dominant-baseline="middle" alignment-baseline="middle" class="noteText" dy="1em" style="font-family: &quot;trebuchet ms&quot;, verdana, arial; font-size: 14px; font-weight: 400;"><tspan x="575">左侧备注说明</tspan></text></g><g><rect x="700" y="543" fill="#EDF2AE" stroke="#666" width="150" height="57" rx="0" ry="0" class="note"></rect><text x="775" y="548" text-anchor="middle" dominant-baseline="middle" alignment-baseline="middle" class="noteText" dy="1em" style="font-family: &quot;trebuchet ms&quot;, verdana, arial; font-size: 14px; font-weight: 400;"><tspan x="775">显示在外部系统</tspan></text><text x="775" y="566" text-anchor="middle" dominant-baseline="middle" alignment-baseline="middle" class="noteText" dy="1em" style="font-family: &quot;trebuchet ms&quot;, verdana, arial; font-size: 14px; font-weight: 400;"><tspan x="775">右侧备注说明</tspan></text></g><g><rect x="250" y="608" fill="#EDF2AE" stroke="#666" width="250" height="38" rx="0" ry="0" class="note"></rect><text x="375" y="613" text-anchor="middle" dominant-baseline="middle" alignment-baseline="middle" class="noteText" dy="1em" style="font-family: &quot;trebuchet ms&quot;, verdana, arial; font-size: 14px; font-weight: 400;"><tspan x="375">跨对象备注说明</tspan></text></g><text x="475" y="702" text-anchor="middle" dominant-baseline="middle" alignment-baseline="middle" class="messageText" dy="1em" style="font-family: &quot;trebuchet ms&quot;, verdana, arial; font-size: 16px; font-weight: 400;">发送消息A</text><line x1="275" y1="733" x2="675" y2="733" class="messageLine0" stroke-width="2" stroke="none" marker-end="url(#arrowhead)" marker-start="url(#sequencenumber)" style="fill: none;"></line><text x="275" y="737" font-family="sans-serif" font-size="12px" text-anchor="middle" textLength="16px" class="sequenceNumber">6</text><g><rect x="670" y="735" fill="#EDF2AE" stroke="#666" width="10" height="267" rx="0" ry="0" class="activation0"></rect></g><text x="375" y="789" text-anchor="middle" dominant-baseline="middle" alignment-baseline="middle" class="messageText" dy="1em" style="font-family: &quot;trebuchet ms&quot;, verdana, arial; font-size: 16px; font-weight: 400;">同步返回消息A1</text><line x1="475" y1="820" x2="275" y2="820" class="messageLine1" stroke-width="2" stroke="none" marker-end="url(#arrowhead)" marker-start="url(#sequencenumber)" style="stroke-dasharray: 3px, 3px; fill: none;"></line><text x="475" y="824" font-family="sans-serif" font-size="12px" text-anchor="middle" textLength="16px" class="sequenceNumber">7</text><text x="375" y="876" text-anchor="middle" dominant-baseline="middle" alignment-baseline="middle" class="messageText" dy="1em" style="font-family: &quot;trebuchet ms&quot;, verdana, arial; font-size: 16px; font-weight: 400;">异步返回消息A2</text><line x1="475" y1="907" x2="275" y2="907" class="messageLine1" stroke-width="2" stroke="none" marker-end="url(#crosshead)" marker-start="url(#sequencenumber)" style="stroke-dasharray: 3px, 3px; fill: none;"></line><text x="475" y="911" font-family="sans-serif" font-size="12px" text-anchor="middle" textLength="16px" class="sequenceNumber">8</text><g><line x1="267" y1="741" x2="483" y2="741" class="loopLine"></line><line x1="483" y1="741" x2="483" y2="915" class="loopLine"></line><line x1="267" y1="915" x2="483" y2="915" class="loopLine"></line><line x1="267" y1="741" x2="267" y2="915" class="loopLine"></line><line x1="267" y1="833" x2="483" y2="833" class="loopLine" style="stroke-dasharray: 3px, 3px;"></line><polygon points="267,741 317,741 317,754 308.6,761 267,761" class="labelBox"></polygon><text x="292" y="754" text-anchor="middle" dominant-baseline="middle" alignment-baseline="middle" class="labelText" style="font-family: &quot;trebuchet ms&quot;, verdana, arial; font-size: 16px; font-weight: 400;">alt</text><text x="400" y="757" text-anchor="middle" class="loopText" style="font-family: &quot;trebuchet ms&quot;, verdana, arial; font-size: 16px; font-weight: 400;"><tspan x="400">[抉择1]</tspan></text><text x="375" y="849" text-anchor="middle" class="loopText" style="font-family: &quot;trebuchet ms&quot;, verdana, arial; font-size: 16px; font-weight: 400;">[抉择2]</text></g><text x="573" y="971" text-anchor="middle" dominant-baseline="middle" alignment-baseline="middle" class="messageText" dy="1em" style="font-family: &quot;trebuchet ms&quot;, verdana, arial; font-size: 16px; font-weight: 400;">发送消息X</text><line x1="670" y1="1002" x2="475" y2="1002" class="messageLine0" stroke-width="2" stroke="none" marker-end="url(#arrowhead)" marker-start="url(#sequencenumber)" style="fill: none;"></line><text x="670" y="1006" font-family="sans-serif" font-size="12px" text-anchor="middle" textLength="16px" class="sequenceNumber">9</text><g><line x1="467" y1="923" x2="688" y2="923" class="loopLine"></line><line x1="688" y1="923" x2="688" y2="1010" class="loopLine"></line><line x1="467" y1="1010" x2="688" y2="1010" class="loopLine"></line><line x1="467" y1="923" x2="467" y2="1010" class="loopLine"></line><polygon points="467,923 517,923 517,936 508.6,943 467,943" class="labelBox"></polygon><text x="492" y="936" text-anchor="middle" dominant-baseline="middle" alignment-baseline="middle" class="labelText" style="font-family: &quot;trebuchet ms&quot;, verdana, arial; font-size: 16px; font-weight: 400;">opt</text><text x="602.5" y="939" text-anchor="middle" class="loopText" style="font-family: &quot;trebuchet ms&quot;, verdana, arial; font-size: 16px; font-weight: 400;"><tspan x="602.5">[可选]</tspan></text></g><g><line x1="259" y1="654" x2="696" y2="654" class="loopLine"></line><line x1="696" y1="654" x2="696" y2="1018" class="loopLine"></line><line x1="259" y1="1018" x2="696" y2="1018" class="loopLine"></line><line x1="259" y1="654" x2="259" y2="1018" class="loopLine"></line><polygon points="259,654 309,654 309,667 300.6,674 259,674" class="labelBox"></polygon><text x="284" y="667" text-anchor="middle" dominant-baseline="middle" alignment-baseline="middle" class="labelText" style="font-family: &quot;trebuchet ms&quot;, verdana, arial; font-size: 16px; font-weight: 400;">loop</text><text x="502.5" y="670" text-anchor="middle" class="loopText" style="font-family: &quot;trebuchet ms&quot;, verdana, arial; font-size: 16px; font-weight: 400;"><tspan x="502.5">[循环]</tspan></text></g><g><rect x="0" y="1034" fill="#eaeaea" stroke="#666" width="150" height="65" rx="3" ry="3" class="actor"></rect><text x="75" y="1066.5" dominant-baseline="central" alignment-baseline="central" class="actor" style="text-anchor: middle; font-size: 14px; font-weight: 400; font-family: Open-Sans, sans-serif;"><tspan x="75" dy="0">@人物角色</tspan></text></g><g><rect x="200" y="1034" fill="#eaeaea" stroke="#666" width="150" height="65" rx="3" ry="3" class="actor"></rect><text x="275" y="1066.5" dominant-baseline="central" alignment-baseline="central" class="actor" style="text-anchor: middle; font-size: 14px; font-weight: 400; font-family: Open-Sans, sans-serif;"><tspan x="275" dy="0">系统角色</tspan></text></g><g><rect x="400" y="1034" fill="#eaeaea" stroke="#666" width="150" height="65" rx="3" ry="3" class="actor"></rect><text x="475" y="1066.5" dominant-baseline="central" alignment-baseline="central" class="actor" style="text-anchor: middle; font-size: 14px; font-weight: 400; font-family: Open-Sans, sans-serif;"><tspan x="475" dy="0">**重要系统角色</tspan></text></g><g><rect x="600" y="1034" fill="#eaeaea" stroke="#666" width="150" height="65" rx="3" ry="3" class="actor"></rect><text x="675" y="1066.5" dominant-baseline="central" alignment-baseline="central" class="actor" style="text-anchor: middle; font-size: 14px; font-weight: 400; font-family: Open-Sans, sans-serif;"><tspan x="675" dy="0">--外部系统角色</tspan></text></g></svg></div><h6 id='以上顺序图的画图脚本示例'><span>以上「顺序图」的画图脚本示例</span></h6><pre class="md-fences md-end-block md-fences-with-lineno ty-contain-cm modeLoaded" spellcheck="false" lang="" style="break-inside: unset;"><div class="CodeMirror cm-s-inner cm-s-null-scroll CodeMirror-wrap" lang=""><div style="overflow: hidden; position: relative; width: 3px; height: 0px; top: 12.545454025268555px; left: 41.988616943359375px;"><textarea autocorrect="off" autocapitalize="off" spellcheck="false" tabindex="0" style="position: absolute; bottom: -1em; padding: 0px; width: 1000px; height: 1em; outline: none;"></textarea></div><div class="CodeMirror-scrollbar-filler" cm-not-content="true"></div><div class="CodeMirror-gutter-filler" cm-not-content="true"></div><div class="CodeMirror-scroll" tabindex="-1"><div class="CodeMirror-sizer" style="margin-left: 32px; margin-bottom: 0px; border-right-width: 0px; padding-right: 0px; padding-bottom: 0px;"><div style="position: relative; top: 0px;"><div class="CodeMirror-lines" role="presentation"><div role="presentation" style="position: relative; outline: none;"><div class="CodeMirror-measure"><div class="CodeMirror-linenumber CodeMirror-gutter-elt"><div>37</div></div></div><div class="CodeMirror-measure"></div><div style="position: relative; z-index: 1;"></div><div class="CodeMirror-code" role="presentation" style=""><div class="CodeMirror-activeline" style="position: relative;"><div class="CodeMirror-activeline-background CodeMirror-linebackground"></div><div class="CodeMirror-gutter-background CodeMirror-activeline-gutter" style="left: -31.988616943359375px; width: 32px;"></div><div class="CodeMirror-gutter-wrapper CodeMirror-activeline-gutter" style="left: -31.988616943359375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt CodeMirror-linenumber-show" style="left: 0px; width: 23px;">1</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">sequenceDiagram</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -31.988616943359375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 23px;">2</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">%% 设置显示消息的自动编号</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -31.988616943359375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 23px;">3</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">autonumber</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -31.988616943359375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 23px;">4</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"><span cm-text="" cm-zwsp="">
</span></span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -31.988616943359375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 23px;">5</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">participant User as @人物角色</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -31.988616943359375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 23px;">6</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">participant Client as 系统角色</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -31.988616943359375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 23px;">7</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">participant Server as **重要系统角色</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -31.988616943359375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 23px;">8</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">participant Extend as --外部系统角色</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -31.988616943359375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 23px;">9</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"><span cm-text="" cm-zwsp="">
</span></span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -31.988616943359375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt CodeMirror-linenumber-show" style="left: 0px; width: 23px;">10</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">par 平行消息</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -31.988616943359375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 23px;">11</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"><span class="cm-tab" role="presentation" cm-text="	">  </span>User -&gt;&gt; Client: 平行发送消息1</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -31.988616943359375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 23px;">12</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">and</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -31.988616943359375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 23px;">13</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"><span class="cm-tab" role="presentation" cm-text="	">  </span>User -&gt;&gt; Client: 平行发送消息2</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -31.988616943359375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 23px;">14</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">and</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -31.988616943359375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 23px;">15</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">  Client -&gt;&gt;+ Server: 平行发送消息3</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -31.988616943359375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 23px;">16</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">  Server --&gt;&gt;- Client: 发送消息</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -31.988616943359375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 23px;">17</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">end</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -31.988616943359375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 23px;">18</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"><span cm-text="" cm-zwsp="">
</span></span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -31.988616943359375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 23px;">19</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">%% 设置区域高亮</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -31.988616943359375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt CodeMirror-linenumber-show" style="left: 0px; width: 23px;">20</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">rect rgba(128, 128, 128, 0.3)</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -31.988616943359375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 23px;">21</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"><span class="cm-tab" role="presentation" cm-text="	">  </span>Extend -&gt;&gt; Extend: 内部动作</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -31.988616943359375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 23px;">22</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">end</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -31.988616943359375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 23px;">23</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"><span cm-text="" cm-zwsp="">
</span></span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -31.988616943359375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 23px;">24</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">Note left of Extend: 显示在外部系统&lt;br /&gt;左侧备注说明</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -31.988616943359375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 23px;">25</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">Note right of Extend: 显示在外部系统&lt;br /&gt;右侧备注说明</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -31.988616943359375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 23px;">26</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">Note over Client,Server: 跨对象备注说明</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -31.988616943359375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 23px;">27</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">loop 循环组</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -31.988616943359375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 23px;">28</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"><span class="cm-tab" role="presentation" cm-text="	">  </span>Client -&gt;&gt;+ Extend: 发送消息A</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -31.988616943359375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 23px;">29</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"><span class="cm-tab" role="presentation" cm-text="	">  </span>alt 情景1</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -31.988616943359375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt CodeMirror-linenumber-show" style="left: 0px; width: 23px;">30</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"><span class="cm-tab" role="presentation" cm-text="	">  </span><span class="cm-tab" role="presentation" cm-text="	">  </span>Server --&gt;&gt; Client: 同步返回消息A1</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -31.988616943359375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 23px;">31</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"><span class="cm-tab" role="presentation" cm-text="	">  </span>else 情景2</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -31.988616943359375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 23px;">32</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"><span class="cm-tab" role="presentation" cm-text="	">  </span><span class="cm-tab" role="presentation" cm-text="	">  </span>Server --X Client: 异步返回消息A2</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -31.988616943359375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 23px;">33</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"><span class="cm-tab" role="presentation" cm-text="	">  </span>end</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -31.988616943359375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 23px;">34</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"><span class="cm-tab" role="presentation" cm-text="	">  </span>opt 可选</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -31.988616943359375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 23px;">35</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"><span class="cm-tab" role="presentation" cm-text="	">  </span><span class="cm-tab" role="presentation" cm-text="	">  </span>Extend -&gt;&gt;- Server: 发送消息X</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -31.988616943359375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 23px;">36</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"><span class="cm-tab" role="presentation" cm-text="	">  </span>end</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -31.988616943359375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt CodeMirror-linenumber-show" style="left: 0px; width: 23px;">37</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">end</span></pre></div></div></div></div></div></div><div style="position: absolute; height: 0px; width: 1px; border-bottom-width: 0px; border-bottom-style: solid; border-bottom-color: transparent; top: 1087px;"></div><div class="CodeMirror-gutters" style="height: 1087px; left: 0.011383056640625px;"><div class="CodeMirror-gutter CodeMirror-linenumbers" style="width: 31px;"></div></div></div></div></pre><h6 id='说明-2'><span>说明</span></h6><ol start='' ><li><p><span>针对顺序图的不同图元应用，重绘不同的外观、形状；</span></p></li><li><p><span>针对 </span><code>opt</code><span> / </span><code>alt</code><span> / </span><code>loop</code><span> / </span><code>par</code><span> 标签设置不同的外观、标题位置。</span></p></li><li><p><span>建议使用实体别名，以提高画图脚本的复用度和可维护性；</span></p></li><li><p><span>支持三类消息线条：同步请求消息、异步请求消息、返回消息；</span></p></li><li><p><span>角色在标准的一类样式的基础上，增加三类扩展的样式，在输出HTML后应用 </span><a href='https://github.com/madmaxchow/VLOOK'><span>VLOOK™</span></a><span> 插件后渲染为不同的样式：</span></p><ul><li><strong><span>人物角色</span></strong><span>：在角色名称前添加 at 符号</span><code>@</code><span>，如</span><code>@人物角色</code></li><li><strong><span>重要系统角色</span></strong><span>：在角色名称前添加两个星号</span><code>**</code><span>，如</span><code>**后端支撑系统名称</code></li><li><strong><span>外部系统角色</span></strong><span>：在角色名称前添加两个减号</span><code>--</code><span>，如</span><code>--外部系统名称</code></li></ul></li><li><p><span>支持对三类标签分组在输出 HTML 后应用 </span><a href='https://github.com/madmaxchow/VLOOK'><span>VLOOK™</span></a><span> 插件渲染为不同的样式：</span></p><ul><li><code>loop...end</code><span>：循环</span></li><li><code>opt...end</code><span>：可选</span></li><li><code>alt..else...end</code><span>：条件选择（alt = 情景1，else = 情景2）</span></li><li><code>par...end</code><span>：平行</span></li></ul></li><li><p><span>支持备注说明。</span></p></li></ol><h2 id='类图'><span>类图</span></h2><p><span>须mermaid V8.4及更新版本支持。</span></p><h6 id='标准类图-1'><span>标准类图 (1)</span></h6><div class="md-diagram-panel md-fences-adv-panel"><svg id="mermaidChart3" width="100%" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" height="264.5625" style="max-width: 940.515625px;" viewBox="-20 -20 940.515625 264.5625" class="md-require-zoom-fix"><style>#mermaidChart3{font-family:sans-serif;font-size:16px;fill:#333;}#mermaidChart3 .error-icon{fill:#552222;}#mermaidChart3 .error-text{fill:#552222;stroke:#552222;}#mermaidChart3 .edge-thickness-normal{stroke-width:2px;}#mermaidChart3 .edge-thickness-thick{stroke-width:3.5px;}#mermaidChart3 .edge-pattern-solid{stroke-dasharray:0;}#mermaidChart3 .edge-pattern-dashed{stroke-dasharray:3;}#mermaidChart3 .edge-pattern-dotted{stroke-dasharray:2;}#mermaidChart3 .marker{fill:#333333;}#mermaidChart3 .marker.cross{stroke:#333333;}#mermaidChart3 svg{font-family:sans-serif;font-size:16px;}#mermaidChart3 g.classGroup text{fill:#9370DB;fill:#131300;stroke:none;font-family:sans-serif;font-size:10px;}#mermaidChart3 g.classGroup text .title{font-weight:bolder;}#mermaidChart3 .classTitle{font-weight:bolder;}#mermaidChart3 .node rect,#mermaidChart3 .node circle,#mermaidChart3 .node ellipse,#mermaidChart3 .node polygon,#mermaidChart3 .node path{fill:#ECECFF;stroke:#9370DB;stroke-width:1px;}#mermaidChart3 .divider{stroke:#9370DB;stroke:1;}#mermaidChart3 g.clickable{cursor:pointer;}#mermaidChart3 g.classGroup rect{fill:#ECECFF;stroke:#9370DB;}#mermaidChart3 g.classGroup line{stroke:#9370DB;stroke-width:1;}#mermaidChart3 .classLabel .box{stroke:none;stroke-width:0;fill:#ECECFF;opacity:0.5;}#mermaidChart3 .classLabel .label{fill:#9370DB;font-size:10px;}#mermaidChart3 .relation{stroke:#333333;stroke-width:1;fill:none;}#mermaidChart3 .dashed-line{stroke-dasharray:3;}#mermaidChart3 #compositionStart,#mermaidChart3 .composition{fill:#333333 !important;stroke:#333333 !important;stroke-width:1;}#mermaidChart3 #compositionEnd,#mermaidChart3 .composition{fill:#333333 !important;stroke:#333333 !important;stroke-width:1;}#mermaidChart3 #dependencyStart,#mermaidChart3 .dependency{fill:#333333 !important;stroke:#333333 !important;stroke-width:1;}#mermaidChart3 #dependencyStart,#mermaidChart3 .dependency{fill:#333333 !important;stroke:#333333 !important;stroke-width:1;}#mermaidChart3 #extensionStart,#mermaidChart3 .extension{fill:#333333 !important;stroke:#333333 !important;stroke-width:1;}#mermaidChart3 #extensionEnd,#mermaidChart3 .extension{fill:#333333 !important;stroke:#333333 !important;stroke-width:1;}#mermaidChart3 #aggregationStart,#mermaidChart3 .aggregation{fill:#ECECFF !important;stroke:#333333 !important;stroke-width:1;}#mermaidChart3 #aggregationEnd,#mermaidChart3 .aggregation{fill:#ECECFF !important;stroke:#333333 !important;stroke-width:1;}#mermaidChart3 .edgeTerminals{font-size:11px;}#mermaidChart3:root{--mermaid-font-family:sans-serif;}#mermaidChart3:root{--mermaid-alt-font-family:sans-serif;}#mermaidChart3 class{fill:apa;}</style><g></g><defs><marker id="extensionStart" class="extension" refX="0" refY="7" markerWidth="190" markerHeight="240" orient="auto"><path d="M 1,7 L18,13 V 1 Z"></path></marker></defs><defs><marker id="extensionEnd" refX="19" refY="7" markerWidth="20" markerHeight="28" orient="auto"><path d="M 1,1 V 13 L18,7 Z"></path></marker></defs><defs><marker id="compositionStart" class="extension" refX="0" refY="7" markerWidth="190" markerHeight="240" orient="auto"><path d="M 18,7 L9,13 L1,7 L9,1 Z"></path></marker></defs><defs><marker id="compositionEnd" refX="19" refY="7" markerWidth="20" markerHeight="28" orient="auto"><path d="M 18,7 L9,13 L1,7 L9,1 Z"></path></marker></defs><defs><marker id="aggregationStart" class="extension" refX="0" refY="7" markerWidth="190" markerHeight="240" orient="auto"><path d="M 18,7 L9,13 L1,7 L9,1 Z"></path></marker></defs><defs><marker id="aggregationEnd" refX="19" refY="7" markerWidth="20" markerHeight="28" orient="auto"><path d="M 18,7 L9,13 L1,7 L9,1 Z"></path></marker></defs><defs><marker id="dependencyStart" class="extension" refX="0" refY="7" markerWidth="190" markerHeight="240" orient="auto"><path d="M 5,7 L9,13 L1,7 L9,1 Z"></path></marker></defs><defs><marker id="dependencyEnd" refX="19" refY="7" markerWidth="20" markerHeight="28" orient="auto"><path d="M 18,7 L9,13 L14,7 L9,1 Z"></path></marker></defs><g id="classid-classA-0" class="classGroup" transform="translate(0,0 )"><rect x="0" y="0" width="135.015625" height="135.921875" class=" "></rect><text y="15" x="0"><tspan x="16.5078125">«interface»</tspan><tspan class="title" dy="10" x="16.5">classA</tspan></text><line x1="0" y1="33.640625" y2="33.640625" x2="135.015625"></line><text x="5" y="43.640625" fill="white" class="classText"><tspan x="5">+public attribute</tspan><tspan x="5" dy="10">-private attribute</tspan><tspan x="5" dy="10">#protected attribute</tspan><tspan x="5" dy="10">~package attribute</tspan></text><line x1="0" y1="82.28125" y2="82.28125" x2="135.015625"></line><text x="5" y="97.28125" fill="white" class="classText"><tspan x="5">+public method</tspan><tspan x="5" dy="10">-private method</tspan><tspan x="5" dy="10">#protected method</tspan><tspan x="5" dy="10">~package method</tspan></text></g><g id="classid-classB-1" class="classGroup" transform="translate(44.5078125,185.921875 )"><rect x="0" y="0" width="46" height="38.640625" class=" "></rect><text y="15" x="0"><tspan class="title" x="5">classB</tspan></text><line x1="0" y1="23.640625" y2="23.640625" x2="46"></line><text x="5" y="33.640625" fill="white" class="classText"></text><line x1="0" y1="28.640625" y2="28.640625" x2="46"></line><text x="5" y="43.640625" fill="white" class="classText"></text></g><g id="classid-classC-2" class="classGroup" transform="translate(185.015625,16.8203125 )"><rect x="0" y="0" width="124" height="102.28125" class=" "></rect><text y="15" x="0"><tspan x="5">«enumeration»</tspan><tspan class="title" dy="10" x="5">classC</tspan></text><line x1="0" y1="33.640625" y2="33.640625" x2="124"></line><text x="5" y="43.640625" fill="white" class="classText"><tspan x="5">RED</tspan><tspan x="5" dy="10">BLUE</tspan><tspan x="5" dy="10">GREEN</tspan><tspan x="5" dy="10">WHITE</tspan><tspan x="5" dy="10">BLACK</tspan></text><line x1="0" y1="92.28125" y2="92.28125" x2="124"></line><text x="5" y="107.28125" fill="white" class="classText"></text></g><g id="classid-classD-3" class="classGroup" transform="translate(224.015625,185.921875 )"><rect x="0" y="0" width="46" height="38.640625" class=" "></rect><text y="15" x="0"><tspan class="title" x="5">classD</tspan></text><line x1="0" y1="23.640625" y2="23.640625" x2="46"></line><text x="5" y="33.640625" fill="white" class="classText"></text><line x1="0" y1="28.640625" y2="28.640625" x2="46"></line><text x="5" y="43.640625" fill="white" class="classText"></text></g><g id="classid-classE-4" class="classGroup" transform="translate(359.015625,48.640625 )"><rect x="0" y="0" width="46" height="38.640625" class=" "></rect><text y="15" x="0"><tspan class="title" x="5">classE</tspan></text><line x1="0" y1="23.640625" y2="23.640625" x2="46"></line><text x="5" y="33.640625" fill="white" class="classText"></text><line x1="0" y1="28.640625" y2="28.640625" x2="46"></line><text x="5" y="43.640625" fill="white" class="classText"></text></g><g id="classid-classF-5" class="classGroup" transform="translate(359.015625,185.921875 )"><rect x="0" y="0" width="46" height="38.640625" class=" "></rect><text y="15" x="0"><tspan class="title" x="5">classF</tspan></text><line x1="0" y1="23.640625" y2="23.640625" x2="46"></line><text x="5" y="33.640625" fill="white" class="classText"></text><line x1="0" y1="28.640625" y2="28.640625" x2="46"></line><text x="5" y="43.640625" fill="white" class="classText"></text></g><g id="classid-classG-6" class="classGroup" transform="translate(455.015625,48.640625 )"><rect x="0" y="0" width="46" height="38.640625" class=" "></rect><text y="15" x="0"><tspan class="title" x="5">classG</tspan></text><line x1="0" y1="23.640625" y2="23.640625" x2="46"></line><text x="5" y="33.640625" fill="white" class="classText"></text><line x1="0" y1="28.640625" y2="28.640625" x2="46"></line><text x="5" y="43.640625" fill="white" class="classText"></text></g><g id="classid-classH-7" class="classGroup" transform="translate(455.015625,185.921875 )"><rect x="0" y="0" width="46" height="38.640625" class=" "></rect><text y="15" x="0"><tspan class="title" x="5">classH</tspan></text><line x1="0" y1="23.640625" y2="23.640625" x2="46"></line><text x="5" y="33.640625" fill="white" class="classText"></text><line x1="0" y1="28.640625" y2="28.640625" x2="46"></line><text x="5" y="43.640625" fill="white" class="classText"></text></g><g id="classid-classI-8" class="classGroup" transform="translate(551.015625,48.640625 )"><rect x="0" y="0" width="46" height="38.640625" class=" "></rect><text y="15" x="0"><tspan class="title" x="5">classI</tspan></text><line x1="0" y1="23.640625" y2="23.640625" x2="46"></line><text x="5" y="33.640625" fill="white" class="classText"></text><line x1="0" y1="28.640625" y2="28.640625" x2="46"></line><text x="5" y="43.640625" fill="white" class="classText"></text></g><g id="classid-classJ-9" class="classGroup" transform="translate(551.015625,185.921875 )"><rect x="0" y="0" width="46" height="38.640625" class=" "></rect><text y="15" x="0"><tspan class="title" x="5">classJ</tspan></text><line x1="0" y1="23.640625" y2="23.640625" x2="46"></line><text x="5" y="33.640625" fill="white" class="classText"></text><line x1="0" y1="28.640625" y2="28.640625" x2="46"></line><text x="5" y="43.640625" fill="white" class="classText"></text></g><g id="classid-classK-10" class="classGroup" transform="translate(647.015625,48.640625 )"><rect x="0" y="0" width="46" height="38.640625" class=" "></rect><text y="15" x="0"><tspan class="title" x="5">classK</tspan></text><line x1="0" y1="23.640625" y2="23.640625" x2="46"></line><text x="5" y="33.640625" fill="white" class="classText"></text><line x1="0" y1="28.640625" y2="28.640625" x2="46"></line><text x="5" y="43.640625" fill="white" class="classText"></text></g><g id="classid-classL-11" class="classGroup" transform="translate(647.015625,185.921875 )"><rect x="0" y="0" width="46" height="38.640625" class=" "></rect><text y="15" x="0"><tspan class="title" x="5">classL</tspan></text><line x1="0" y1="23.640625" y2="23.640625" x2="46"></line><text x="5" y="33.640625" fill="white" class="classText"></text><line x1="0" y1="28.640625" y2="28.640625" x2="46"></line><text x="5" y="43.640625" fill="white" class="classText"></text></g><g id="classid-classM-12" class="classGroup" transform="translate(743.015625,48.640625 )"><rect x="0" y="0" width="46" height="38.640625" class=" "></rect><text y="15" x="0"><tspan class="title" x="5">classM</tspan></text><line x1="0" y1="23.640625" y2="23.640625" x2="46"></line><text x="5" y="33.640625" fill="white" class="classText"></text><line x1="0" y1="28.640625" y2="28.640625" x2="46"></line><text x="5" y="43.640625" fill="white" class="classText"></text></g><g id="classid-classN-13" class="classGroup" transform="translate(743.015625,185.921875 )"><rect x="0" y="0" width="46" height="38.640625" class=" "></rect><text y="15" x="0"><tspan class="title" x="5">classN</tspan></text><line x1="0" y1="23.640625" y2="23.640625" x2="46"></line><text x="5" y="33.640625" fill="white" class="classText"></text><line x1="0" y1="28.640625" y2="28.640625" x2="46"></line><text x="5" y="43.640625" fill="white" class="classText"></text></g><g id="classid-classO-14" class="classGroup" transform="translate(839.015625,48.640625 )"><rect x="0" y="0" width="46" height="38.640625" class=" "></rect><text y="15" x="0"><tspan class="title" x="5">classO</tspan></text><line x1="0" y1="23.640625" y2="23.640625" x2="46"></line><text x="5" y="33.640625" fill="white" class="classText"></text><line x1="0" y1="28.640625" y2="28.640625" x2="46"></line><text x="5" y="43.640625" fill="white" class="classText"></text></g><g id="classid-classP-15" class="classGroup" transform="translate(839.015625,185.921875 )"><rect x="0" y="0" width="46" height="38.640625" class=" "></rect><text y="15" x="0"><tspan class="title" x="5">classP</tspan></text><line x1="0" y1="23.640625" y2="23.640625" x2="46"></line><text x="5" y="33.640625" fill="white" class="classText"></text><line x1="0" y1="28.640625" y2="28.640625" x2="46"></line><text x="5" y="43.640625" fill="white" class="classText"></text></g><path d="M67.5078125,135.921875L67.5078125,140.08854166666666C67.5078125,144.25520833333334,67.5078125,152.58854166666666,67.5078125,160.921875C67.5078125,169.25520833333334,67.5078125,177.58854166666666,67.5078125,181.75520833333334L67.5078125,185.921875" id="edge0" class="relation" marker-start="url(#extensionStart)"></path><g class="classLabel"><rect class="box" x="32" y="147.71875" width="71.015625" height="18.640625"></rect><text class="label" x="67.5078125" y="160.921875" fill="red" text-anchor="middle">Inheritance</text></g><path d="M247.015625,119.1015625L247.015625,126.07161458333333C247.015625,133.04166666666666,247.015625,146.98177083333334,247.015625,158.11848958333334C247.015625,169.25520833333334,247.015625,177.58854166666666,247.015625,181.75520833333334L247.015625,185.921875" id="edge1" class="relation" marker-start="url(#compositionStart)"></path><g class="classLabel"><rect class="box" x="211.515625" y="139.3125" width="71" height="18.640625"></rect><text class="label" x="247.015625" y="152.51171875" fill="red" text-anchor="middle">Composition</text></g><path d="M382.015625,87.28125L382.015625,99.5546875C382.015625,111.828125,382.015625,136.375,382.015625,152.81510416666666C382.015625,169.25520833333334,382.015625,177.58854166666666,382.015625,181.75520833333334L382.015625,185.921875" id="edge2" class="relation" marker-start="url(#aggregationStart)"></path><g class="classLabel"><rect class="box" x="346.515625" y="123.40625" width="71" height="18.640625"></rect><text class="label" x="382.015625" y="136.6015625" fill="red" text-anchor="middle">Aggregation</text></g><path d="M478.015625,87.28125L478.015625,99.5546875C478.015625,111.828125,478.015625,136.375,478.015625,152.81510416666666C478.015625,169.25520833333334,478.015625,177.58854166666666,478.015625,181.75520833333334L478.015625,185.921875" id="edge3" class="relation" marker-start="url(#dependencyStart)"></path><g class="classLabel"><rect class="box" x="442.515625" y="123.40625" width="71" height="18.640625"></rect><text class="label" x="478.015625" y="136.6015625" fill="red" text-anchor="middle">Association</text></g><g class="cardinality"><text class="type1" x="468.015625" y="99.78125" fill="black" font-size="6">*</text></g><g class="cardinality"><text class="type2" x="483.015625" y="173.421875" fill="black" font-size="6">1</text></g><path d="M574.015625,87.28125L574.015625,99.5546875C574.015625,111.828125,574.015625,136.375,574.015625,152.81510416666666C574.015625,169.25520833333334,574.015625,177.58854166666666,574.015625,181.75520833333334L574.015625,185.921875" id="edge4" class="relation"></path><g class="classLabel"><rect class="box" x="538.515625" y="123.40625" width="71" height="18.640625"></rect><text class="label" x="574.015625" y="136.6015625" fill="red" text-anchor="middle">Link(Solid)</text></g><g class="cardinality"><text class="type1" x="569.015625" y="99.78125" fill="black" font-size="6">many</text></g><path d="M670.015625,87.28125L670.015625,99.5546875C670.015625,111.828125,670.015625,136.375,670.015625,152.81510416666666C670.015625,169.25520833333334,670.015625,177.58854166666666,670.015625,181.75520833333334L670.015625,185.921875" id="edge5" class="relation dashed-line" marker-end="url(#dependencyEnd)"></path><g class="classLabel"><rect class="box" x="637.515625" y="123.40625" width="65" height="18.640625"></rect><text class="label" x="670.015625" y="136.6015625" fill="red" text-anchor="middle">Dependency</text></g><g class="cardinality"><text class="type1" x="665.015625" y="99.78125" fill="black" font-size="6">1</text></g><g class="cardinality"><text class="type2" x="680.015625" y="173.421875" fill="black" font-size="6">1..n</text></g><path d="M766.015625,87.28125L766.015625,99.5546875C766.015625,111.828125,766.015625,136.375,766.015625,152.81510416666666C766.015625,169.25520833333334,766.015625,177.58854166666666,766.015625,181.75520833333334L766.015625,185.921875" id="edge6" class="relation dashed-line" marker-start="url(#extensionStart)"></path><g class="classLabel"><rect class="box" x="730.515625" y="123.40625" width="71" height="18.640625"></rect><text class="label" x="766.015625" y="136.6015625" fill="red" text-anchor="middle">Realization</text></g><path d="M862.015625,87.28125L862.015625,99.5546875C862.015625,111.828125,862.015625,136.375,862.015625,152.81510416666666C862.015625,169.25520833333334,862.015625,177.58854166666666,862.015625,181.75520833333334L862.015625,185.921875" id="edge7" class="relation dashed-line"></path><g class="classLabel"><rect class="box" x="823.515625" y="123.40625" width="77" height="18.640625"></rect><text class="label" x="862.015625" y="136.6015625" fill="red" text-anchor="middle">Link(Dashed)</text></g></svg></div><h6 id='标准类图-2'><span>标准类图 (2)</span></h6><div class="md-diagram-panel md-fences-adv-panel"><svg id="mermaidChart4" width="100%" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" height="264.5625" style="max-width: 940.515625px;" viewBox="-20 -20 940.515625 264.5625" class="md-require-zoom-fix"><style>#mermaidChart4{font-family:sans-serif;font-size:16px;fill:#333;}#mermaidChart4 .error-icon{fill:#552222;}#mermaidChart4 .error-text{fill:#552222;stroke:#552222;}#mermaidChart4 .edge-thickness-normal{stroke-width:2px;}#mermaidChart4 .edge-thickness-thick{stroke-width:3.5px;}#mermaidChart4 .edge-pattern-solid{stroke-dasharray:0;}#mermaidChart4 .edge-pattern-dashed{stroke-dasharray:3;}#mermaidChart4 .edge-pattern-dotted{stroke-dasharray:2;}#mermaidChart4 .marker{fill:#333333;}#mermaidChart4 .marker.cross{stroke:#333333;}#mermaidChart4 svg{font-family:sans-serif;font-size:16px;}#mermaidChart4 g.classGroup text{fill:#9370DB;fill:#131300;stroke:none;font-family:sans-serif;font-size:10px;}#mermaidChart4 g.classGroup text .title{font-weight:bolder;}#mermaidChart4 .classTitle{font-weight:bolder;}#mermaidChart4 .node rect,#mermaidChart4 .node circle,#mermaidChart4 .node ellipse,#mermaidChart4 .node polygon,#mermaidChart4 .node path{fill:#ECECFF;stroke:#9370DB;stroke-width:1px;}#mermaidChart4 .divider{stroke:#9370DB;stroke:1;}#mermaidChart4 g.clickable{cursor:pointer;}#mermaidChart4 g.classGroup rect{fill:#ECECFF;stroke:#9370DB;}#mermaidChart4 g.classGroup line{stroke:#9370DB;stroke-width:1;}#mermaidChart4 .classLabel .box{stroke:none;stroke-width:0;fill:#ECECFF;opacity:0.5;}#mermaidChart4 .classLabel .label{fill:#9370DB;font-size:10px;}#mermaidChart4 .relation{stroke:#333333;stroke-width:1;fill:none;}#mermaidChart4 .dashed-line{stroke-dasharray:3;}#mermaidChart4 #compositionStart,#mermaidChart4 .composition{fill:#333333 !important;stroke:#333333 !important;stroke-width:1;}#mermaidChart4 #compositionEnd,#mermaidChart4 .composition{fill:#333333 !important;stroke:#333333 !important;stroke-width:1;}#mermaidChart4 #dependencyStart,#mermaidChart4 .dependency{fill:#333333 !important;stroke:#333333 !important;stroke-width:1;}#mermaidChart4 #dependencyStart,#mermaidChart4 .dependency{fill:#333333 !important;stroke:#333333 !important;stroke-width:1;}#mermaidChart4 #extensionStart,#mermaidChart4 .extension{fill:#333333 !important;stroke:#333333 !important;stroke-width:1;}#mermaidChart4 #extensionEnd,#mermaidChart4 .extension{fill:#333333 !important;stroke:#333333 !important;stroke-width:1;}#mermaidChart4 #aggregationStart,#mermaidChart4 .aggregation{fill:#ECECFF !important;stroke:#333333 !important;stroke-width:1;}#mermaidChart4 #aggregationEnd,#mermaidChart4 .aggregation{fill:#ECECFF !important;stroke:#333333 !important;stroke-width:1;}#mermaidChart4 .edgeTerminals{font-size:11px;}#mermaidChart4:root{--mermaid-font-family:sans-serif;}#mermaidChart4:root{--mermaid-alt-font-family:sans-serif;}#mermaidChart4 class{fill:apa;}</style><g></g><defs><marker id="extensionStart" class="extension" refX="0" refY="7" markerWidth="190" markerHeight="240" orient="auto"><path d="M 1,7 L18,13 V 1 Z"></path></marker></defs><defs><marker id="extensionEnd" refX="19" refY="7" markerWidth="20" markerHeight="28" orient="auto"><path d="M 1,1 V 13 L18,7 Z"></path></marker></defs><defs><marker id="compositionStart" class="extension" refX="0" refY="7" markerWidth="190" markerHeight="240" orient="auto"><path d="M 18,7 L9,13 L1,7 L9,1 Z"></path></marker></defs><defs><marker id="compositionEnd" refX="19" refY="7" markerWidth="20" markerHeight="28" orient="auto"><path d="M 18,7 L9,13 L1,7 L9,1 Z"></path></marker></defs><defs><marker id="aggregationStart" class="extension" refX="0" refY="7" markerWidth="190" markerHeight="240" orient="auto"><path d="M 18,7 L9,13 L1,7 L9,1 Z"></path></marker></defs><defs><marker id="aggregationEnd" refX="19" refY="7" markerWidth="20" markerHeight="28" orient="auto"><path d="M 18,7 L9,13 L1,7 L9,1 Z"></path></marker></defs><defs><marker id="dependencyStart" class="extension" refX="0" refY="7" markerWidth="190" markerHeight="240" orient="auto"><path d="M 5,7 L9,13 L1,7 L9,1 Z"></path></marker></defs><defs><marker id="dependencyEnd" refX="19" refY="7" markerWidth="20" markerHeight="28" orient="auto"><path d="M 18,7 L9,13 L14,7 L9,1 Z"></path></marker></defs><g id="classid-classA-16" class="classGroup" transform="translate(0,0 )"><rect x="0" y="0" width="135.015625" height="135.921875" class=" "></rect><text y="15" x="0"><tspan x="16.5078125">«interface»</tspan><tspan class="title" dy="10" x="16.5">classA</tspan></text><line x1="0" y1="33.640625" y2="33.640625" x2="135.015625"></line><text x="5" y="43.640625" fill="white" class="classText"><tspan x="5">+public attribute</tspan><tspan x="5" dy="10">-private attribute</tspan><tspan x="5" dy="10">#protected attribute</tspan><tspan x="5" dy="10">~package attribute</tspan></text><line x1="0" y1="82.28125" y2="82.28125" x2="135.015625"></line><text x="5" y="97.28125" fill="white" class="classText"><tspan x="5">+public method</tspan><tspan x="5" dy="10">-private method</tspan><tspan x="5" dy="10">#protected method</tspan><tspan x="5" dy="10">~package method</tspan></text></g><g id="classid-classB-17" class="classGroup" transform="translate(44.5078125,185.921875 )"><rect x="0" y="0" width="46" height="38.640625" class=" "></rect><text y="15" x="0"><tspan class="title" x="5">classB</tspan></text><line x1="0" y1="23.640625" y2="23.640625" x2="46"></line><text x="5" y="33.640625" fill="white" class="classText"></text><line x1="0" y1="28.640625" y2="28.640625" x2="46"></line><text x="5" y="43.640625" fill="white" class="classText"></text></g><g id="classid-classC-18" class="classGroup" transform="translate(185.015625,16.8203125 )"><rect x="0" y="0" width="124" height="102.28125" class=" "></rect><text y="15" x="0"><tspan x="5">«enumeration»</tspan><tspan class="title" dy="10" x="5">classC</tspan></text><line x1="0" y1="33.640625" y2="33.640625" x2="124"></line><text x="5" y="43.640625" fill="white" class="classText"><tspan x="5">RED</tspan><tspan x="5" dy="10">BLUE</tspan><tspan x="5" dy="10">GREEN</tspan><tspan x="5" dy="10">WHITE</tspan><tspan x="5" dy="10">BLACK</tspan></text><line x1="0" y1="92.28125" y2="92.28125" x2="124"></line><text x="5" y="107.28125" fill="white" class="classText"></text></g><g id="classid-classD-19" class="classGroup" transform="translate(224.015625,185.921875 )"><rect x="0" y="0" width="46" height="38.640625" class=" "></rect><text y="15" x="0"><tspan class="title" x="5">classD</tspan></text><line x1="0" y1="23.640625" y2="23.640625" x2="46"></line><text x="5" y="33.640625" fill="white" class="classText"></text><line x1="0" y1="28.640625" y2="28.640625" x2="46"></line><text x="5" y="43.640625" fill="white" class="classText"></text></g><g id="classid-classE-20" class="classGroup" transform="translate(359.015625,48.640625 )"><rect x="0" y="0" width="46" height="38.640625" class=" "></rect><text y="15" x="0"><tspan class="title" x="5">classE</tspan></text><line x1="0" y1="23.640625" y2="23.640625" x2="46"></line><text x="5" y="33.640625" fill="white" class="classText"></text><line x1="0" y1="28.640625" y2="28.640625" x2="46"></line><text x="5" y="43.640625" fill="white" class="classText"></text></g><g id="classid-classF-21" class="classGroup" transform="translate(359.015625,185.921875 )"><rect x="0" y="0" width="46" height="38.640625" class=" "></rect><text y="15" x="0"><tspan class="title" x="5">classF</tspan></text><line x1="0" y1="23.640625" y2="23.640625" x2="46"></line><text x="5" y="33.640625" fill="white" class="classText"></text><line x1="0" y1="28.640625" y2="28.640625" x2="46"></line><text x="5" y="43.640625" fill="white" class="classText"></text></g><g id="classid-classG-22" class="classGroup" transform="translate(455.015625,48.640625 )"><rect x="0" y="0" width="46" height="38.640625" class=" "></rect><text y="15" x="0"><tspan class="title" x="5">classG</tspan></text><line x1="0" y1="23.640625" y2="23.640625" x2="46"></line><text x="5" y="33.640625" fill="white" class="classText"></text><line x1="0" y1="28.640625" y2="28.640625" x2="46"></line><text x="5" y="43.640625" fill="white" class="classText"></text></g><g id="classid-classH-23" class="classGroup" transform="translate(455.015625,185.921875 )"><rect x="0" y="0" width="46" height="38.640625" class=" "></rect><text y="15" x="0"><tspan class="title" x="5">classH</tspan></text><line x1="0" y1="23.640625" y2="23.640625" x2="46"></line><text x="5" y="33.640625" fill="white" class="classText"></text><line x1="0" y1="28.640625" y2="28.640625" x2="46"></line><text x="5" y="43.640625" fill="white" class="classText"></text></g><g id="classid-classI-24" class="classGroup" transform="translate(551.015625,48.640625 )"><rect x="0" y="0" width="46" height="38.640625" class=" "></rect><text y="15" x="0"><tspan class="title" x="5">classI</tspan></text><line x1="0" y1="23.640625" y2="23.640625" x2="46"></line><text x="5" y="33.640625" fill="white" class="classText"></text><line x1="0" y1="28.640625" y2="28.640625" x2="46"></line><text x="5" y="43.640625" fill="white" class="classText"></text></g><g id="classid-classJ-25" class="classGroup" transform="translate(551.015625,185.921875 )"><rect x="0" y="0" width="46" height="38.640625" class=" "></rect><text y="15" x="0"><tspan class="title" x="5">classJ</tspan></text><line x1="0" y1="23.640625" y2="23.640625" x2="46"></line><text x="5" y="33.640625" fill="white" class="classText"></text><line x1="0" y1="28.640625" y2="28.640625" x2="46"></line><text x="5" y="43.640625" fill="white" class="classText"></text></g><g id="classid-classK-26" class="classGroup" transform="translate(647.015625,48.640625 )"><rect x="0" y="0" width="46" height="38.640625" class=" "></rect><text y="15" x="0"><tspan class="title" x="5">classK</tspan></text><line x1="0" y1="23.640625" y2="23.640625" x2="46"></line><text x="5" y="33.640625" fill="white" class="classText"></text><line x1="0" y1="28.640625" y2="28.640625" x2="46"></line><text x="5" y="43.640625" fill="white" class="classText"></text></g><g id="classid-classL-27" class="classGroup" transform="translate(647.015625,185.921875 )"><rect x="0" y="0" width="46" height="38.640625" class=" "></rect><text y="15" x="0"><tspan class="title" x="5">classL</tspan></text><line x1="0" y1="23.640625" y2="23.640625" x2="46"></line><text x="5" y="33.640625" fill="white" class="classText"></text><line x1="0" y1="28.640625" y2="28.640625" x2="46"></line><text x="5" y="43.640625" fill="white" class="classText"></text></g><g id="classid-classM-28" class="classGroup" transform="translate(743.015625,48.640625 )"><rect x="0" y="0" width="46" height="38.640625" class=" "></rect><text y="15" x="0"><tspan class="title" x="5">classM</tspan></text><line x1="0" y1="23.640625" y2="23.640625" x2="46"></line><text x="5" y="33.640625" fill="white" class="classText"></text><line x1="0" y1="28.640625" y2="28.640625" x2="46"></line><text x="5" y="43.640625" fill="white" class="classText"></text></g><g id="classid-classN-29" class="classGroup" transform="translate(743.015625,185.921875 )"><rect x="0" y="0" width="46" height="38.640625" class=" "></rect><text y="15" x="0"><tspan class="title" x="5">classN</tspan></text><line x1="0" y1="23.640625" y2="23.640625" x2="46"></line><text x="5" y="33.640625" fill="white" class="classText"></text><line x1="0" y1="28.640625" y2="28.640625" x2="46"></line><text x="5" y="43.640625" fill="white" class="classText"></text></g><g id="classid-classO-30" class="classGroup" transform="translate(839.015625,48.640625 )"><rect x="0" y="0" width="46" height="38.640625" class=" "></rect><text y="15" x="0"><tspan class="title" x="5">classO</tspan></text><line x1="0" y1="23.640625" y2="23.640625" x2="46"></line><text x="5" y="33.640625" fill="white" class="classText"></text><line x1="0" y1="28.640625" y2="28.640625" x2="46"></line><text x="5" y="43.640625" fill="white" class="classText"></text></g><g id="classid-classP-31" class="classGroup" transform="translate(839.015625,185.921875 )"><rect x="0" y="0" width="46" height="38.640625" class=" "></rect><text y="15" x="0"><tspan class="title" x="5">classP</tspan></text><line x1="0" y1="23.640625" y2="23.640625" x2="46"></line><text x="5" y="33.640625" fill="white" class="classText"></text><line x1="0" y1="28.640625" y2="28.640625" x2="46"></line><text x="5" y="43.640625" fill="white" class="classText"></text></g><path d="M67.5078125,135.921875L67.5078125,140.08854166666666C67.5078125,144.25520833333334,67.5078125,152.58854166666666,67.5078125,160.921875C67.5078125,169.25520833333334,67.5078125,177.58854166666666,67.5078125,181.75520833333334L67.5078125,185.921875" id="edge8" class="relation" marker-start="url(#extensionStart)"></path><g class="classLabel"><rect class="box" x="32" y="147.71875" width="71.015625" height="18.640625"></rect><text class="label" x="67.5078125" y="160.921875" fill="red" text-anchor="middle">Inheritance</text></g><path d="M247.015625,119.1015625L247.015625,126.07161458333333C247.015625,133.04166666666666,247.015625,146.98177083333334,247.015625,158.11848958333334C247.015625,169.25520833333334,247.015625,177.58854166666666,247.015625,181.75520833333334L247.015625,185.921875" id="edge9" class="relation" marker-start="url(#compositionStart)"></path><g class="classLabel"><rect class="box" x="211.515625" y="139.3125" width="71" height="18.640625"></rect><text class="label" x="247.015625" y="152.51171875" fill="red" text-anchor="middle">Composition</text></g><path d="M382.015625,87.28125L382.015625,99.5546875C382.015625,111.828125,382.015625,136.375,382.015625,152.81510416666666C382.015625,169.25520833333334,382.015625,177.58854166666666,382.015625,181.75520833333334L382.015625,185.921875" id="edge10" class="relation" marker-start="url(#aggregationStart)"></path><g class="classLabel"><rect class="box" x="346.515625" y="123.40625" width="71" height="18.640625"></rect><text class="label" x="382.015625" y="136.6015625" fill="red" text-anchor="middle">Aggregation</text></g><path d="M478.015625,87.28125L478.015625,99.5546875C478.015625,111.828125,478.015625,136.375,478.015625,152.81510416666666C478.015625,169.25520833333334,478.015625,177.58854166666666,478.015625,181.75520833333334L478.015625,185.921875" id="edge11" class="relation" marker-start="url(#dependencyStart)"></path><g class="classLabel"><rect class="box" x="442.515625" y="123.40625" width="71" height="18.640625"></rect><text class="label" x="478.015625" y="136.6015625" fill="red" text-anchor="middle">Association</text></g><g class="cardinality"><text class="type1" x="468.015625" y="99.78125" fill="black" font-size="6">*</text></g><g class="cardinality"><text class="type2" x="483.015625" y="173.421875" fill="black" font-size="6">1</text></g><path d="M574.015625,87.28125L574.015625,99.5546875C574.015625,111.828125,574.015625,136.375,574.015625,152.81510416666666C574.015625,169.25520833333334,574.015625,177.58854166666666,574.015625,181.75520833333334L574.015625,185.921875" id="edge12" class="relation"></path><g class="classLabel"><rect class="box" x="538.515625" y="123.40625" width="71" height="18.640625"></rect><text class="label" x="574.015625" y="136.6015625" fill="red" text-anchor="middle">Link(Solid)</text></g><g class="cardinality"><text class="type1" x="569.015625" y="99.78125" fill="black" font-size="6">many</text></g><path d="M670.015625,87.28125L670.015625,99.5546875C670.015625,111.828125,670.015625,136.375,670.015625,152.81510416666666C670.015625,169.25520833333334,670.015625,177.58854166666666,670.015625,181.75520833333334L670.015625,185.921875" id="edge13" class="relation dashed-line" marker-end="url(#dependencyEnd)"></path><g class="classLabel"><rect class="box" x="637.515625" y="123.40625" width="65" height="18.640625"></rect><text class="label" x="670.015625" y="136.6015625" fill="red" text-anchor="middle">Dependency</text></g><g class="cardinality"><text class="type1" x="665.015625" y="99.78125" fill="black" font-size="6">1</text></g><g class="cardinality"><text class="type2" x="680.015625" y="173.421875" fill="black" font-size="6">1..n</text></g><path d="M766.015625,87.28125L766.015625,99.5546875C766.015625,111.828125,766.015625,136.375,766.015625,152.81510416666666C766.015625,169.25520833333334,766.015625,177.58854166666666,766.015625,181.75520833333334L766.015625,185.921875" id="edge14" class="relation dashed-line" marker-start="url(#extensionStart)"></path><g class="classLabel"><rect class="box" x="730.515625" y="123.40625" width="71" height="18.640625"></rect><text class="label" x="766.015625" y="136.6015625" fill="red" text-anchor="middle">Realization</text></g><path d="M862.015625,87.28125L862.015625,99.5546875C862.015625,111.828125,862.015625,136.375,862.015625,152.81510416666666C862.015625,169.25520833333334,862.015625,177.58854166666666,862.015625,181.75520833333334L862.015625,185.921875" id="edge15" class="relation dashed-line"></path><g class="classLabel"><rect class="box" x="823.515625" y="123.40625" width="77" height="18.640625"></rect><text class="label" x="862.015625" y="136.6015625" fill="red" text-anchor="middle">Link(Dashed)</text></g></svg></div><h6 id='以上类图的画图脚本示例'><span>以上「类图」的画图脚本示例</span></h6><pre class="md-fences md-end-block md-fences-with-lineno ty-contain-cm modeLoaded" spellcheck="false" lang="" style="break-inside: unset;"><div class="CodeMirror cm-s-inner cm-s-null-scroll CodeMirror-wrap" lang=""><div style="overflow: hidden; position: relative; width: 3px; height: 0px; top: 12.545454025268555px; left: 43.991485595703125px;"><textarea autocorrect="off" autocapitalize="off" spellcheck="false" tabindex="0" style="position: absolute; bottom: -1em; padding: 0px; width: 1000px; height: 1em; outline: none;"></textarea></div><div class="CodeMirror-scrollbar-filler" cm-not-content="true"></div><div class="CodeMirror-gutter-filler" cm-not-content="true"></div><div class="CodeMirror-scroll" tabindex="-1"><div class="CodeMirror-sizer" style="margin-left: 34px; margin-bottom: 0px; border-right-width: 0px; padding-right: 0px; padding-bottom: 0px;"><div style="position: relative; top: 0px;"><div class="CodeMirror-lines" role="presentation"><div role="presentation" style="position: relative; outline: none;"><div class="CodeMirror-measure"><div class="CodeMirror-linenumber CodeMirror-gutter-elt"><div>30</div></div></div><div class="CodeMirror-measure"></div><div style="position: relative; z-index: 1;"></div><div class="CodeMirror-code" role="presentation" style=""><div class="CodeMirror-activeline" style="position: relative;"><div class="CodeMirror-activeline-background CodeMirror-linebackground"></div><div class="CodeMirror-gutter-background CodeMirror-activeline-gutter" style="left: -33.991485595703125px; width: 34px;"></div><div class="CodeMirror-gutter-wrapper CodeMirror-activeline-gutter" style="left: -33.991485595703125px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt CodeMirror-linenumber-show" style="left: 0px; width: 25px;">1</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">classDiagram</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -33.991485595703125px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 25px;">2</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">classA &lt;|-- classB : Inheritance</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -33.991485595703125px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 25px;">3</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">classC *-- classD : Composition</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -33.991485595703125px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 25px;">4</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">classE o-- classF : Aggregation</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -33.991485595703125px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 25px;">5</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">classG "*" &lt;-- "1" classH : Association</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -33.991485595703125px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 25px;">6</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">classI "many" -- classJ : Link(Solid)</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -33.991485595703125px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 25px;">7</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">classK "1" ..&gt; "1..n" classL : Dependency</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -33.991485595703125px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 25px;">8</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">classM &lt;|.. classN : Realization</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -33.991485595703125px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 25px;">9</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">classO .. classP : Link(Dashed)</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -33.991485595703125px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt CodeMirror-linenumber-show" style="left: 0px; width: 25px;">10</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"><span cm-text="" cm-zwsp="">
</span></span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -33.991485595703125px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 25px;">11</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">class classA~Class~{</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -33.991485595703125px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 25px;">12</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"> &nbsp;  &lt;&lt;interface&gt;&gt;</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -33.991485595703125px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 25px;">13</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"> &nbsp;  +public attribute</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -33.991485595703125px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 25px;">14</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"> &nbsp;  -private attribute</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -33.991485595703125px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 25px;">15</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"> &nbsp;  #protected attribute</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -33.991485595703125px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 25px;">16</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"> &nbsp;  ~package attribute</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -33.991485595703125px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 25px;">17</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"> &nbsp;  +public method()</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -33.991485595703125px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 25px;">18</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"> &nbsp;  -private method()</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -33.991485595703125px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 25px;">19</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"> &nbsp;  #protected method()</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -33.991485595703125px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt CodeMirror-linenumber-show" style="left: 0px; width: 25px;">20</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"> &nbsp;  ~package method()</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -33.991485595703125px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 25px;">21</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">}</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -33.991485595703125px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 25px;">22</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"><span cm-text="" cm-zwsp="">
</span></span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -33.991485595703125px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 25px;">23</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">class classC{</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -33.991485595703125px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 25px;">24</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"> &nbsp;  &lt;&lt;enumeration&gt;&gt;</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -33.991485595703125px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 25px;">25</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"> &nbsp;  RED</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -33.991485595703125px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 25px;">26</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"> &nbsp;  BLUE</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -33.991485595703125px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 25px;">27</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"> &nbsp;  GREEN</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -33.991485595703125px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 25px;">28</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"> &nbsp;  WHITE</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -33.991485595703125px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 25px;">29</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"> &nbsp;  BLACK</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -33.991485595703125px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt CodeMirror-linenumber-show" style="left: 0px; width: 25px;">30</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">}</span></pre></div></div></div></div></div></div><div style="position: absolute; height: 0px; width: 1px; border-bottom-width: 0px; border-bottom-style: solid; border-bottom-color: transparent; top: 873px;"></div><div class="CodeMirror-gutters" style="height: 873px; left: 0.008514404296875px;"><div class="CodeMirror-gutter CodeMirror-linenumbers" style="width: 33px;"></div></div></div></div></pre><h2 id='状态图'><span>状态图</span></h2><h3 id='标准状态机图'><span>标准状态机图</span></h3><h6 id='环境要求'><span>环境要求</span></h6><ul><li><span>Typora </span><code>#macOS 版本|0.9.9.30+#(gray)</code><span> </span><code>#Windows 版本|0.9.80+#(blue)</code></li><li><span>mermaid </span><code>#Version|8.4+#</code><span> </span></li></ul><h6 id='新版标准状态机图-1'><span>新版标准状态机图 (1)</span></h6><div class="md-diagram-panel md-fences-adv-panel"><svg id="mermaidChart5" width="100%" xmlns="http://www.w3.org/2000/svg" height="307.578125" style="max-width: 259.63819885253906px;" viewBox="-8  -8 148.36468505859375 307.578125" class="md-require-zoom-fix"><style>#mermaidChart5{font-family:sans-serif;font-size:16px;fill:#333;}#mermaidChart5 .error-icon{fill:#552222;}#mermaidChart5 .error-text{fill:#552222;stroke:#552222;}#mermaidChart5 .edge-thickness-normal{stroke-width:2px;}#mermaidChart5 .edge-thickness-thick{stroke-width:3.5px;}#mermaidChart5 .edge-pattern-solid{stroke-dasharray:0;}#mermaidChart5 .edge-pattern-dashed{stroke-dasharray:3;}#mermaidChart5 .edge-pattern-dotted{stroke-dasharray:2;}#mermaidChart5 .marker{fill:#333333;}#mermaidChart5 .marker.cross{stroke:#333333;}#mermaidChart5 svg{font-family:sans-serif;font-size:16px;}#mermaidChart5 g.stateGroup text{fill:#9370DB;stroke:none;font-size:10px;}#mermaidChart5 g.stateGroup text{fill:#333;stroke:none;font-size:10px;}#mermaidChart5 g.stateGroup .state-title{font-weight:bolder;fill:black;}#mermaidChart5 g.stateGroup rect{fill:#ECECFF;stroke:#9370DB;}#mermaidChart5 g.stateGroup line{stroke:#333333;stroke-width:1;}#mermaidChart5 .transition{stroke:#333333;stroke-width:1;fill:none;}#mermaidChart5 .stateGroup .composit{fill:white;border-bottom:1px;}#mermaidChart5 .stateGroup .alt-composit{fill:#e0e0e0;border-bottom:1px;}#mermaidChart5 .state-note{stroke:#aaaa33;fill:#fff5ad;}#mermaidChart5 .state-note text{fill:black;stroke:none;font-size:10px;}#mermaidChart5 .stateLabel .box{stroke:none;stroke-width:0;fill:#ECECFF;opacity:0.5;}#mermaidChart5 .edgeLabel .label rect{fill:hsl(80,100%,96.2745098039%);opacity:0.5;}#mermaidChart5 .edgeLabel .label text{fill:rgb(9.5000000001,9.5000000001,9.5000000001);}#mermaidChart5 .label div .edgeLabel{color:rgb(9.5000000001,9.5000000001,9.5000000001);}#mermaidChart5 .stateLabel text{fill:black;font-size:10px;font-weight:bold;}#mermaidChart5 .node circle.state-start{fill:#333333;stroke:black;}#mermaidChart5 .node circle.state-end{fill:hsl(240,60%,86.2745098039%);stroke:white;stroke-width:1.5;}#mermaidChart5 .end-state-inner{fill:white;stroke-width:1.5;}#mermaidChart5 .node rect{fill:#ECECFF;stroke:#9370DB;stroke-width:1px;}#mermaidChart5 #statediagram-barbEnd{fill:#333333;}#mermaidChart5 .statediagram-cluster rect{fill:#ECECFF;stroke:#9370DB;stroke-width:1px;}#mermaidChart5 .cluster-label,#mermaidChart5 .nodeLabel{color:#333;}#mermaidChart5 .statediagram-cluster rect.outer{rx:5px;ry:5px;}#mermaidChart5 .statediagram-state .divider{stroke:#9370DB;}#mermaidChart5 .statediagram-state .title-state{rx:5px;ry:5px;}#mermaidChart5 .statediagram-cluster.statediagram-cluster .inner{fill:white;}#mermaidChart5 .statediagram-cluster.statediagram-cluster-alt .inner{fill:#e0e0e0;}#mermaidChart5 .statediagram-cluster .inner{rx:0;ry:0;}#mermaidChart5 .statediagram-state rect.basic{rx:5px;ry:5px;}#mermaidChart5 .statediagram-state rect.divider{stroke-dasharray:10,10;fill:#efefef;}#mermaidChart5 .note-edge{stroke-dasharray:5;}#mermaidChart5 .statediagram-note rect{fill:#fff5ad;stroke:#aaaa33;stroke-width:1px;rx:0;ry:0;}#mermaidChart5 .statediagram-note rect{fill:#fff5ad;stroke:#aaaa33;stroke-width:1px;rx:0;ry:0;}#mermaidChart5 .statediagram-note text{fill:black;}#mermaidChart5 .statediagram-note .nodeLabel{color:black;}#mermaidChart5 #dependencyStart,#mermaidChart5 #dependencyEnd{fill:#333333;stroke:#333333;stroke-width:1;}#mermaidChart5:root{--mermaid-font-family:sans-serif;}#mermaidChart5:root{--mermaid-alt-font-family:sans-serif;}#mermaidChart5 state{fill:apa;}</style><g></g><defs><marker id="dependencyEnd" refX="19" refY="7" markerWidth="20" markerHeight="28" orient="auto"><path d="M 19,7 L9,13 L14,7 L9,1 Z"></path></marker></defs><g id="start1" class="stateGroup" transform="translate(52.3425,0 )" data-x-shift="52.3425"><circle class="start-state" r="5" cx="13" cy="13"></circle></g><g id="状态A" class="stateGroup" transform="translate(38.670625,46 )" data-x-shift="38.670625"><rect x="8" y="8" width="37.34375" height="27.859375" rx="5"></rect><text x="16" y="26" font-size="24" class="state-title">状态A</text></g><g id="状态B" class="stateGroup" transform="translate(0,125.859375 )" data-x-shift="0"><rect x="8" y="8" width="37.75" height="27.859375" rx="5"></rect><text x="16" y="26" font-size="24" class="state-title">状态B</text></g><g id="状态C" class="stateGroup" transform="translate(38.545625,205.71875 )" data-x-shift="38.545625"><rect x="8" y="8" width="37.59375" height="27.859375" rx="5"></rect><text x="16" y="26" font-size="24" class="state-title">状态C</text></g><g id="end1" class="stateGroup" transform="translate(50.3425,269.578125 )" data-x-shift="50.3425"><circle class="end-state-outer" r="7" cx="15" cy="15"></circle><circle class="end-state-inner" r="5" cx="15" cy="15"></circle></g><path d="M65.3425,26L65.34249999999999,27.666666666666668C65.3425,29.333333333333332,65.3425,32.666666666666664,65.34249999999999,36C65.3425,39.333333333333336,65.3425,42.666666666666664,65.34249999999999,44.333333333333336L65.3425,46" id="edge0" class="transition" marker-end="url(#dependencyEnd)"></path><path d="M44.21585697515164,89.859375L41.3257141459597,92.859375C38.435571316767756,95.859375,32.65528565838388,101.859375,29.76514282919194,107.859375C26.875,113.859375,26.875,119.859375,26.875,122.859375L26.875,125.859375" id="edge1" class="transition" marker-end="url(#dependencyEnd)"></path><g class="stateLabel"><rect class="box" x="0.7465602779933356" y="93.05965315824155" width="57.109375" height="17.5625"></rect><text text-anchor="middle" x="29.301247777993336" y="105.34090315824155">状态转换说明</text><text text-anchor="middle" x="29.301247777993336" y="114.90340315824155"></text></g><path d="M26.875,169.71875L26.875,172.71875C26.875,175.71875,26.875,181.71875,29.76514282919194,187.71875C32.65528565838388,193.71875,38.435571316767756,199.71875,41.3257141459597,202.71875L44.21585697515164,205.71875" id="edge2" class="transition" marker-end="url(#dependencyEnd)"></path><g class="stateLabel"><rect class="box" x="0.7465602779933391" y="177.95597184175844" width="57.109375" height="17.5625"></rect><text text-anchor="middle" x="29.30124777799334" y="190.23722184175844">状态转换说明</text><text text-anchor="middle" x="29.30124777799334" y="199.79972184175844"></text></g><path d="M86.46914302484836,205.71875L89.35928585404031,202.71875C92.24942868323224,199.71875,98.02971434161611,193.71875,100.91985717080804,184.06380208333334C103.81,174.40885416666666,103.81,161.09895833333334,103.80999999999999,147.7890625C103.81,134.47916666666666,103.81,121.16927083333333,100.91985717080804,111.51432291666667C98.02971434161611,101.859375,92.24942868323224,95.859375,89.35928585404031,92.859375L86.46914302484836,89.859375" id="edge3" class="transition" marker-end="url(#dependencyEnd)"></path><g class="stateLabel"><rect class="box" x="75.2553125" y="135.515625" width="57.109375" height="17.546875"></rect><text text-anchor="middle" x="103.81" y="147.7890625">状态转换说明</text><text text-anchor="middle" x="103.81" y="157.3359375"></text></g><path d="M65.3425,249.578125L65.34249999999999,251.24479166666666C65.3425,252.91145833333334,65.3425,256.2447916666667,65.34249999999999,259.578125C65.3425,262.9114583333333,65.3425,266.2447916666667,65.34249999999999,267.9114583333333L65.3425,269.578125" id="edge4" class="transition" marker-end="url(#dependencyEnd)"></path></svg></div><h6 id='以上状态机图的画图脚本示例-1'><span>以上「状态机图」的画图脚本示例</span></h6><pre class="md-fences md-end-block md-fences-with-lineno ty-contain-cm modeLoaded" spellcheck="false" lang=""><div class="CodeMirror cm-s-inner cm-s-null-scroll CodeMirror-wrap" lang=""><div style="overflow: hidden; position: relative; width: 3px; height: 0px; top: 12.545454025268555px; left: 35.99432373046875px;"><textarea autocorrect="off" autocapitalize="off" spellcheck="false" tabindex="0" style="position: absolute; bottom: -1em; padding: 0px; width: 1000px; height: 1em; outline: none;"></textarea></div><div class="CodeMirror-scrollbar-filler" cm-not-content="true"></div><div class="CodeMirror-gutter-filler" cm-not-content="true"></div><div class="CodeMirror-scroll" tabindex="-1"><div class="CodeMirror-sizer" style="margin-left: 26px; margin-bottom: 0px; border-right-width: 0px; padding-right: 0px; padding-bottom: 0px;"><div style="position: relative; top: 0px;"><div class="CodeMirror-lines" role="presentation"><div role="presentation" style="position: relative; outline: none;"><div class="CodeMirror-measure"><pre><span>xxxxxxxxxx</span></pre><div class="CodeMirror-linenumber CodeMirror-gutter-elt"><div>6</div></div></div><div class="CodeMirror-measure"></div><div style="position: relative; z-index: 1;"></div><div class="CodeMirror-code" role="presentation" style=""><div class="CodeMirror-activeline" style="position: relative;"><div class="CodeMirror-activeline-background CodeMirror-linebackground"></div><div class="CodeMirror-gutter-background CodeMirror-activeline-gutter" style="left: -25.99432373046875px; width: 26px;"></div><div class="CodeMirror-gutter-wrapper CodeMirror-activeline-gutter" style="left: -25.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt CodeMirror-linenumber-show" style="left: 0px; width: 17px;">1</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">stateDiagram</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -25.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 17px;">2</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">[*] --&gt; 状态A</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -25.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 17px;">3</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">状态A --&gt; 状态B : 状态转换说明</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -25.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 17px;">4</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">状态B --&gt; 状态C : 状态转换说明</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -25.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 17px;">5</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">状态C --&gt; 状态A : 状态转换说明</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -25.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt CodeMirror-linenumber-show" style="left: 0px; width: 17px;">6</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">状态C --&gt; [*]</span></pre></div></div></div></div></div></div><div style="position: absolute; height: 0px; width: 1px; border-bottom-width: 0px; border-bottom-style: solid; border-bottom-color: transparent; top: 175px;"></div><div class="CodeMirror-gutters" style="height: 175px;"><div class="CodeMirror-gutter CodeMirror-linenumbers" style="width: 25px;"></div></div></div></div></pre><h6 id='新版标准状态机图-2'><span>新版标准状态机图 (2)</span></h6><div class="md-diagram-panel md-fences-adv-panel"><svg id="mermaidChart6" width="100%" xmlns="http://www.w3.org/2000/svg" height="724.078125" style="max-width: 1540.638198852539px;" viewBox="0  0 880.3646850585938 724.078125" class="md-require-zoom-fix"><style>#mermaidChart6{font-family:sans-serif;font-size:16px;fill:#333;}#mermaidChart6 .error-icon{fill:#552222;}#mermaidChart6 .error-text{fill:#552222;stroke:#552222;}#mermaidChart6 .edge-thickness-normal{stroke-width:2px;}#mermaidChart6 .edge-thickness-thick{stroke-width:3.5px;}#mermaidChart6 .edge-pattern-solid{stroke-dasharray:0;}#mermaidChart6 .edge-pattern-dashed{stroke-dasharray:3;}#mermaidChart6 .edge-pattern-dotted{stroke-dasharray:2;}#mermaidChart6 .marker{fill:#333333;}#mermaidChart6 .marker.cross{stroke:#333333;}#mermaidChart6 svg{font-family:sans-serif;font-size:16px;}#mermaidChart6 g.stateGroup text{fill:#9370DB;stroke:none;font-size:10px;}#mermaidChart6 g.stateGroup text{fill:#333;stroke:none;font-size:10px;}#mermaidChart6 g.stateGroup .state-title{font-weight:bolder;fill:black;}#mermaidChart6 g.stateGroup rect{fill:#ECECFF;stroke:#9370DB;}#mermaidChart6 g.stateGroup line{stroke:#333333;stroke-width:1;}#mermaidChart6 .transition{stroke:#333333;stroke-width:1;fill:none;}#mermaidChart6 .stateGroup .composit{fill:white;border-bottom:1px;}#mermaidChart6 .stateGroup .alt-composit{fill:#e0e0e0;border-bottom:1px;}#mermaidChart6 .state-note{stroke:#aaaa33;fill:#fff5ad;}#mermaidChart6 .state-note text{fill:black;stroke:none;font-size:10px;}#mermaidChart6 .stateLabel .box{stroke:none;stroke-width:0;fill:#ECECFF;opacity:0.5;}#mermaidChart6 .edgeLabel .label rect{fill:hsl(80,100%,96.2745098039%);opacity:0.5;}#mermaidChart6 .edgeLabel .label text{fill:rgb(9.5000000001,9.5000000001,9.5000000001);}#mermaidChart6 .label div .edgeLabel{color:rgb(9.5000000001,9.5000000001,9.5000000001);}#mermaidChart6 .stateLabel text{fill:black;font-size:10px;font-weight:bold;}#mermaidChart6 .node circle.state-start{fill:#333333;stroke:black;}#mermaidChart6 .node circle.state-end{fill:hsl(240,60%,86.2745098039%);stroke:white;stroke-width:1.5;}#mermaidChart6 .end-state-inner{fill:white;stroke-width:1.5;}#mermaidChart6 .node rect{fill:#ECECFF;stroke:#9370DB;stroke-width:1px;}#mermaidChart6 #statediagram-barbEnd{fill:#333333;}#mermaidChart6 .statediagram-cluster rect{fill:#ECECFF;stroke:#9370DB;stroke-width:1px;}#mermaidChart6 .cluster-label,#mermaidChart6 .nodeLabel{color:#333;}#mermaidChart6 .statediagram-cluster rect.outer{rx:5px;ry:5px;}#mermaidChart6 .statediagram-state .divider{stroke:#9370DB;}#mermaidChart6 .statediagram-state .title-state{rx:5px;ry:5px;}#mermaidChart6 .statediagram-cluster.statediagram-cluster .inner{fill:white;}#mermaidChart6 .statediagram-cluster.statediagram-cluster-alt .inner{fill:#e0e0e0;}#mermaidChart6 .statediagram-cluster .inner{rx:0;ry:0;}#mermaidChart6 .statediagram-state rect.basic{rx:5px;ry:5px;}#mermaidChart6 .statediagram-state rect.divider{stroke-dasharray:10,10;fill:#efefef;}#mermaidChart6 .note-edge{stroke-dasharray:5;}#mermaidChart6 .statediagram-note rect{fill:#fff5ad;stroke:#aaaa33;stroke-width:1px;rx:0;ry:0;}#mermaidChart6 .statediagram-note rect{fill:#fff5ad;stroke:#aaaa33;stroke-width:1px;rx:0;ry:0;}#mermaidChart6 .statediagram-note text{fill:black;}#mermaidChart6 .statediagram-note .nodeLabel{color:black;}#mermaidChart6 #dependencyStart,#mermaidChart6 #dependencyEnd{fill:#333333;stroke:#333333;stroke-width:1;}#mermaidChart6:root{--mermaid-font-family:sans-serif;}#mermaidChart6:root{--mermaid-alt-font-family:sans-serif;}#mermaidChart6 state{fill:apa;}</style><g></g><defs><marker id="dependencyEnd" refX="19" refY="7" markerWidth="20" markerHeight="28" orient="auto"><path d="M 19,7 L9,13 L14,7 L9,1 Z"></path></marker></defs><g id="fork_state" class="stateGroup" transform="translate(446.1823425292969,173.359375 )" data-x-shift="446.1823425292969"><rect width="70" height="7" x="8" y="8" style="stroke: black; fill: black;"></rect></g><g id="start1" class="stateGroup" transform="translate(476.1823425292969,0 )" data-x-shift="476.1823425292969"><circle class="start-state" r="5" cx="13" cy="13"></circle></g><g id="状态组1" class="stateGroup" transform="translate(376.1823425292969,91 )" data-x-shift="376.1823425292969"><rect x="0" y="-33" width="226" height="83.359375" rx="5"></rect><rect x="0" y="-33" width="226" height="30" rx="5"></rect><rect x="0" y="-9" class="composit" width="226" height="56.359375" rx="0"></rect><g id="状态11" class="stateGroup" transform="translate(46,0 )" data-x-shift="46"><rect x="8" y="8" width="106" height="27.859375" rx="5"></rect><text x="16" y="20.4" font-size="24" class="state-title">在此填写状态的描述内容</text><text x="8" y="35.059375" class="state-description"></text><line x1="8" y1="24.859375" y2="24.859375" class="descr-divider" x2="114"></line></g><g id="start1" class="stateGroup" transform="translate(0,12.9296875 )" data-x-shift="0"><circle class="start-state" r="5" cx="13" cy="13"></circle></g><g id="end1" class="stateGroup" transform="translate(474.1823425292969,603.078125 )" data-x-shift="474.1823425292969"><circle class="end-state-outer" r="7" cx="15" cy="15"></circle><circle class="end-state-inner" r="5" cx="15" cy="15"></circle></g><path d="M26,25.9296875L27.666666666666668,25.9296875C29.333333333333332,25.9296875,32.666666666666664,25.9296875,36,25.9296875C39.333333333333336,25.9296875,42.666666666666664,25.9296875,44.333333333333336,25.9296875L46,25.9296875" id="edge5" class="transition" marker-end="url(#dependencyEnd)"></path><path d="M176,25.9296875L177.66666666666666,25.9296875C179.33333333333334,25.9296875,182.66666666666666,25.9296875,186,25.9296875C189.33333333333334,25.9296875,192.66666666666666,25.9296875,194.33333333333334,25.9296875L196,25.9296875" id="edge6" class="transition" marker-end="url(#dependencyEnd)"></path><text x="98.453125" y="-15" font-size="24" class="state-title">状态组1</text></g><g id="状态组1-note" class="state-note" transform="translate(652.1823425292969,69.1796875 )" data-x-shift="652.1823425292969"><rect x="0" y="8" height="45" width="143.234375"></rect><g><text class="noteText" style="text-anchor: start;"><tspan x="10" y="25">【状态组1】右边的备注信息，</tspan><tspan x="10" y="37.5">内容支持换行。</tspan></text></g></g><g id="状态组2" class="stateGroup" transform="translate(235.140625,337.609375 )" data-x-shift="235.140625"><rect x="-8" y="-33" width="191.5731201171875" height="83.359375" rx="5"></rect><rect x="-8" y="-33" width="191.5731201171875" height="30" rx="5"></rect><rect x="-8" y="-9" class="composit" width="191.5731201171875" height="56.359375" rx="0"></rect><g id="start1" class="stateGroup" transform="translate(0,8.9296875 )" data-x-shift="0"><circle class="start-state" r="5" cx="13" cy="13"></circle></g><g id="状态21" class="stateGroup" transform="translate(76.12,0 )" data-x-shift="76.12"><rect x="8" y="8" width="41.453125" height="27.859375" rx="5"></rect><text x="16" y="26" font-size="24" class="state-title">状态21</text></g><g id="end1" class="stateGroup" transform="translate(153.573125,6.9296875 )" data-x-shift="153.573125"><circle class="end-state-outer" r="7" cx="15" cy="15"></circle><circle class="end-state-inner" r="5" cx="15" cy="15"></circle></g><path d="M26,21.9296875L30.176666666666666,21.9296875C34.35333333333333,21.9296875,42.70666666666667,21.9296875,51.06,21.9296875C59.413333333333334,21.9296875,67.76666666666667,21.9296875,71.94333333333334,21.9296875L76.12,21.9296875" id="edge7" class="transition" marker-end="url(#dependencyEnd)"></path><g class="stateLabel"><rect class="box" x="22.505312500000002" y="8.5" width="57.109375" height="19.859375"></rect><text text-anchor="middle" x="51.06" y="21.9296875">状态转换说明</text><text text-anchor="middle" x="51.06" y="33.7890625"></text></g><path d="M133.573125,21.9296875L135.23979166666666,21.9296875C136.90645833333335,21.9296875,140.23979166666666,21.9296875,143.573125,21.9296875C146.90645833333335,21.9296875,150.23979166666666,21.9296875,151.90645833333335,21.9296875L153.573125,21.9296875" id="edge8" class="transition" marker-end="url(#dependencyEnd)"></path><text x="73.23968505859375" y="-15" font-size="24" class="state-title">状态组2</text></g><g id="状态组2-note" class="state-note" transform="translate(35,322.0390625 )" data-x-shift="35"><rect x="0" y="8" height="32.5" width="134.140625"></rect><g><text class="noteText" style="text-anchor: start;"><tspan x="10" y="25">【状态组2】左边的备注信息</tspan></text></g></g><g id="状态组3" class="stateGroup" transform="translate(496.7137451171875,261.359375 )" data-x-shift="496.7137451171875"><rect x="-8" y="-33" width="301.447509765625" height="235.859375" rx="5"></rect><rect x="-8" y="-33" width="301.447509765625" height="30" rx="5"></rect><rect x="-8" y="-9" class="composit" width="301.447509765625" height="208.859375" rx="0"></rect><g id="start1" class="stateGroup" transform="translate(0,8.9296875 )" data-x-shift="0"><circle class="start-state" r="5" cx="13" cy="13"></circle></g><g id="状态31" class="stateGroup" transform="translate(57.8203125,0 )" data-x-shift="57.8203125"><rect x="8" y="8" width="41.453125" height="27.859375" rx="5"></rect><text x="16" y="26" font-size="24" class="state-title">状态31</text></g><g id="end1" class="stateGroup" transform="translate(237.900625,6.9296875 )" data-x-shift="237.900625"><circle class="end-state-outer" r="7" cx="15" cy="15"></circle><circle class="end-state-inner" r="5" cx="15" cy="15"></circle></g><g id="divider-id-1" class="stateGroup" transform="translate(0,84.9296875 )" data-x-shift="0"><line x1="8" class="divider" x2="293.447509765625" y1="0" y2="0" style="stroke: grey; stroke-dasharray: 3px;"></line></g><g id="start2" class="stateGroup" transform="translate(0,150.9296875 )" data-x-shift="0"><circle class="start-state" r="5" cx="13" cy="13"></circle></g><g id="大写【关闭】" class="stateGroup" transform="translate(46,142 )" data-x-shift="46"><rect x="8" y="8" width="65.09375" height="27.859375" rx="5"></rect><text x="16" y="26" font-size="24" class="state-title">大写【关闭】</text></g><g id="大写【打开】" class="stateGroup" transform="translate(212.35375,142 )" data-x-shift="212.35375"><rect x="8" y="8" width="65.09375" height="27.859375" rx="5"></rect><text x="16" y="26" font-size="24" class="state-title">大写【打开】</text></g><path d="M26,21.9296875L27.666666666666668,21.9296875C29.333333333333332,21.9296875,32.666666666666664,21.9296875,37.970052083333336,21.9296875C43.2734375,21.9296875,50.546875,21.9296875,54.18359375,21.9296875L57.8203125,21.9296875" id="edge9" class="transition" marker-end="url(#dependencyEnd)"></path><path d="M115.2734375,21.9296875L124.34848958333333,21.9296875C133.42354166666667,21.9296875,151.57364583333333,21.9296875,172.01151041666665,21.9296875C192.449375,21.9296875,215.17499999999998,21.9296875,226.5378125,21.9296875L237.900625,21.9296875" id="edge10" class="transition" marker-end="url(#dependencyEnd)"></path><path d="M26,163.9296875L27.666666666666668,163.9296875C29.333333333333332,163.9296875,32.666666666666664,163.9296875,36,163.9296875C39.333333333333336,163.9296875,42.666666666666664,163.9296875,44.333333333333336,163.9296875L46,163.9296875" id="edge11" class="transition" marker-end="url(#dependencyEnd)"></path><path d="M118.54762721011514,142L127.07698100842929,136.15494791666666C135.60633480674343,130.30989583333334,152.6650424033717,118.61979166666667,169.72375,118.61979166666667C186.7824575966283,118.61979166666667,203.84116519325656,130.30989583333334,212.37051899157072,136.15494791666666L220.89987278988485,142" id="edge12" class="transition" marker-end="url(#dependencyEnd)"></path><g class="stateLabel"><rect class="box" x="131.0284375" y="93.5" width="77.390625" height="19.859375"></rect><text text-anchor="middle" x="169.72375" y="106.9296875">按一下 CapLock 键</text><text text-anchor="middle" x="169.72375" y="118.7890625"></text></g><path d="M212.35375,172.7042868102049L205.24874999999997,174.2418535918374C198.14374999999998,175.77942037346995,183.93375,178.85455393673496,169.72375,178.85455393673496C155.51375,178.85455393673496,141.30375,175.77942037346995,134.19875,174.2418535918374L127.09375,172.7042868102049" id="edge13" class="transition" marker-end="url(#dependencyEnd)"></path><g class="stateLabel"><rect class="box" x="131.0284375" y="168.5" width="77.390625" height="19.859375"></rect><text text-anchor="middle" x="169.72375" y="181.9296875">按一下 CapLock 键</text><text text-anchor="middle" x="169.72375" y="193.7890625"></text></g><text x="128.1768798828125" y="-15" font-size="24" class="state-title">状态组3</text></g><g id="join_state" class="stateGroup" transform="translate(446.1823425292969,496.21875 )" data-x-shift="446.1823425292969"><rect width="70" height="7" x="8" y="8" style="stroke: black; fill: black;"></rect></g><g id="状态4" class="stateGroup" transform="translate(462.7292175292969,539.21875 )" data-x-shift="462.7292175292969"><rect x="8" y="8" width="36.90625" height="27.859375" rx="5"></rect><text x="16" y="26" font-size="24" class="state-title">状态4</text></g><g id="end1" class="stateGroup"><circle class="end-state-outer" r="7" cx="15" cy="15"></circle><circle class="end-state-inner" r="5" cx="15" cy="15"></circle></g><path d="M489.1823425292969,26L489.1823425292969,27.666666666666668C489.1823425292969,29.333333333333332,489.1823425292969,32.666666666666664,489.1823425292969,36C489.1823425292969,39.333333333333336,489.1823425292969,42.666666666666664,489.1823425292969,46C489.1823425292969,49.333333333333336,489.1823425292969,52.666666666666664,489.1823425292969,54.333333333333336L489.1823425292969,56" id="edge14" class="transition" marker-end="url(#dependencyEnd)"></path><path d="M489.1823425292969,143.359375L489.1823425292969,145.02604166666666C489.1823425292969,146.69270833333334,489.1823425292969,150.02604166666666,489.1823425292969,153.359375C489.1823425292969,156.69270833333334,489.1823425292969,160.02604166666666,489.1823425292969,163.359375C489.1823425292969,166.69270833333334,489.1823425292969,170.02604166666666,489.1823425292969,171.69270833333334L489.1823425292969,173.359375" id="edge15" class="transition" marker-end="url(#dependencyEnd)"></path><path d="M446.1823425292969,190.70120672779785L426.973149617513,193.31090143983155C407.7639567057292,195.92059615186523,369.34557088216144,201.13998557593263,350.1363779703776,205.41634695463298C330.92718505859375,209.69270833333334,330.92718505859375,213.02604166666666,330.92718505859375,229.06770833333334C330.92718505859375,245.109375,330.92718505859375,273.859375,330.92718505859375,288.234375L330.92718505859375,302.609375" id="edge16" class="transition" marker-end="url(#dependencyEnd)"></path><path d="M532.1823425292969,190.70120672779785L551.3915354410807,193.31090143983155C570.6007283528646,195.92059615186523,609.0191141764323,201.13998557593263,628.2283070882162,205.41634695463298C647.4375,209.69270833333334,647.4375,213.02604166666666,647.4375,216.359375C647.4375,219.69270833333334,647.4375,223.02604166666666,647.4375,224.69270833333334L647.4375,226.359375" id="edge17" class="transition" marker-end="url(#dependencyEnd)"></path><path d="M330.92718505859375,389.96875L330.92718505859375,404.34375C330.92718505859375,418.71875,330.92718505859375,447.46875,330.92718505859375,463.5104166666667C330.92718505859375,479.5520833333333,330.92718505859375,482.8854166666667,350.1363779703776,487.16177804536704C369.34557088216144,491.4381394240674,407.7639567057292,496.65752884813475,426.973149617513,499.2672235601685L446.1823425292969,501.87691827220215" id="edge18" class="transition" marker-end="url(#dependencyEnd)"></path><path d="M647.4375,466.21875L647.4375,467.8854166666667C647.4375,469.5520833333333,647.4375,472.8854166666667,647.4375,476.21875C647.4375,479.5520833333333,647.4375,482.8854166666667,628.2283070882162,487.16177804536704C609.0191141764323,491.4381394240674,570.6007283528646,496.65752884813475,551.3915354410807,499.2672235601685L532.1823425292969,501.87691827220215" id="edge19" class="transition" marker-end="url(#dependencyEnd)"></path><path d="M489.1823425292969,519.21875L489.1823425292969,520.8854166666666C489.1823425292969,522.5520833333334,489.1823425292969,525.8854166666666,489.1823425292969,529.21875C489.1823425292969,532.5520833333334,489.1823425292969,535.8854166666666,489.1823425292969,537.5520833333334L489.1823425292969,539.21875" id="edge20" class="transition" marker-end="url(#dependencyEnd)"></path><path d="M489.1823425292969,583.078125L489.1823425292969,584.7447916666666C489.1823425292969,586.4114583333334,489.1823425292969,589.7447916666666,489.1823425292969,593.078125C489.1823425292969,596.4114583333334,489.1823425292969,599.7447916666666,489.1823425292969,601.4114583333334L489.1823425292969,603.078125" id="edge21" class="transition" marker-end="url(#dependencyEnd)"></path></svg></div><h6 id='以上状态机图的画图脚本示例-2'><span>以上「状态机图」的画图脚本示例</span></h6><pre class="md-fences md-end-block md-fences-with-lineno ty-contain-cm modeLoaded" spellcheck="false" lang="" style="break-inside: unset;"><div class="CodeMirror cm-s-inner cm-s-null-scroll CodeMirror-wrap" lang=""><div style="overflow: hidden; position: relative; width: 3px; height: 0px; top: 12.545454025268555px; left: 42.997161865234375px;"><textarea autocorrect="off" autocapitalize="off" spellcheck="false" tabindex="0" style="position: absolute; bottom: -1em; padding: 0px; width: 1000px; height: 1em; outline: none;"></textarea></div><div class="CodeMirror-scrollbar-filler" cm-not-content="true"></div><div class="CodeMirror-gutter-filler" cm-not-content="true"></div><div class="CodeMirror-scroll" tabindex="-1"><div class="CodeMirror-sizer" style="margin-left: 33px; margin-bottom: 0px; border-right-width: 0px; padding-right: 0px; padding-bottom: 0px;"><div style="position: relative; top: 0px;"><div class="CodeMirror-lines" role="presentation"><div role="presentation" style="position: relative; outline: none;"><div class="CodeMirror-measure"><pre><span>xxxxxxxxxx</span></pre><div class="CodeMirror-linenumber CodeMirror-gutter-elt"><div>42</div></div></div><div class="CodeMirror-measure"></div><div style="position: relative; z-index: 1;"></div><div class="CodeMirror-code" role="presentation" style=""><div class="CodeMirror-activeline" style="position: relative;"><div class="CodeMirror-activeline-background CodeMirror-linebackground"></div><div class="CodeMirror-gutter-background CodeMirror-activeline-gutter" style="left: -32.997161865234375px; width: 33px;"></div><div class="CodeMirror-gutter-wrapper CodeMirror-activeline-gutter" style="left: -32.997161865234375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt CodeMirror-linenumber-show" style="left: 0px; width: 24px;">1</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">```mermaid</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -32.997161865234375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 24px;">2</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">stateDiagram</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -32.997161865234375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 24px;">3</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">state fork_state &lt;&lt;fork&gt;&gt;</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -32.997161865234375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 24px;">4</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"><span cm-text="" cm-zwsp="">
</span></span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -32.997161865234375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 24px;">5</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">[*] --&gt; 状态组1</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -32.997161865234375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 24px;">6</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">状态组1 --&gt; fork_state</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -32.997161865234375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 24px;">7</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">fork_state --&gt; 状态组2</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -32.997161865234375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 24px;">8</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">fork_state --&gt; 状态组3</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -32.997161865234375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 24px;">9</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"><span cm-text="" cm-zwsp="">
</span></span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -32.997161865234375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt CodeMirror-linenumber-show" style="left: 0px; width: 24px;">10</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">note right of 状态组1</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -32.997161865234375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 24px;">11</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"> &nbsp;  【状态组1】右边的备注信息，</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -32.997161865234375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 24px;">12</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"> &nbsp;  内容支持换行。</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -32.997161865234375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 24px;">13</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">end note</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -32.997161865234375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 24px;">14</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">state 状态组1 {</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -32.997161865234375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 24px;">15</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"> &nbsp;  状态11 : 在此填写状态的描述内容</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -32.997161865234375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 24px;">16</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"> &nbsp;  [*] --&gt; 状态11</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -32.997161865234375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 24px;">17</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"> &nbsp;  状态11 --&gt; [*]</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -32.997161865234375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 24px;">18</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">}</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -32.997161865234375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 24px;">19</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"><span cm-text="" cm-zwsp="">
</span></span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -32.997161865234375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt CodeMirror-linenumber-show" style="left: 0px; width: 24px;">20</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">note left of 状态组2 : 【状态组2】左边的备注信息</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -32.997161865234375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 24px;">21</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">state 状态组2 {</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -32.997161865234375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 24px;">22</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"> &nbsp;  [*] --&gt; 状态21: 状态转换说明</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -32.997161865234375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 24px;">23</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"> &nbsp;  状态21 --&gt; [*]</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -32.997161865234375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 24px;">24</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">}</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -32.997161865234375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 24px;">25</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"><span cm-text="" cm-zwsp="">
</span></span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -32.997161865234375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 24px;">26</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">%% 可以编写注释（以两个英文百分号开头)</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -32.997161865234375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 24px;">27</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">state 状态组3 {</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -32.997161865234375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 24px;">28</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"> &nbsp;  [*] --&gt; 状态31</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -32.997161865234375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 24px;">29</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"> &nbsp;  状态31 --&gt; [*]</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -32.997161865234375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt CodeMirror-linenumber-show" style="left: 0px; width: 24px;">30</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"> &nbsp;  --</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -32.997161865234375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 24px;">31</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"> &nbsp;  [*] --&gt; 大写【关闭】</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -32.997161865234375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 24px;">32</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"> &nbsp;  大写【关闭】 --&gt; 大写【打开】 : 按一下 CapLock 键</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -32.997161865234375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 24px;">33</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"> &nbsp;  大写【打开】 --&gt; 大写【关闭】 : 按一下 CapLock 键</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -32.997161865234375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 24px;">34</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">}</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -32.997161865234375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 24px;">35</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"><span cm-text="" cm-zwsp="">
</span></span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -32.997161865234375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 24px;">36</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">state join_state &lt;&lt;join&gt;&gt;</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -32.997161865234375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 24px;">37</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"><span cm-text="" cm-zwsp="">
</span></span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -32.997161865234375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 24px;">38</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">状态组2 --&gt; join_state</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -32.997161865234375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 24px;">39</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">状态组3 --&gt; join_state</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -32.997161865234375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt CodeMirror-linenumber-show" style="left: 0px; width: 24px;">40</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">join_state --&gt; 状态4</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -32.997161865234375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 24px;">41</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">状态4 --&gt; [*]</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -32.997161865234375px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt CodeMirror-linenumber-show" style="left: 0px; width: 24px;">42</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"><span class="cm-invalidchar" title="\u200b" aria-label="\u200b" cm-text="​">•</span>```</span></pre></div></div></div></div></div></div><div style="position: absolute; height: 0px; width: 1px; border-bottom-width: 0px; border-bottom-style: solid; border-bottom-color: transparent; top: 1222px;"></div><div class="CodeMirror-gutters" style="height: 1222px;"><div class="CodeMirror-gutter CodeMirror-linenumbers" style="width: 32px;"></div></div></div></div></pre><h3 id='旧版状态图'><span>旧版状态图</span></h3><h6 id='说明-3'><span>说明</span></h6><ol start='' ><li><p><span>该样式的状态图是借用</span><strong><span>流程图</span></strong><span>脚本实现，是mermaid未支持</span><a href='#标准状态机图'><span>标准状态图</span></a><span>时的变通方案；</span></p></li><li><p><span>针对该类状态图及不同图元的应用，重绘不同的外观、形状；</span></p></li><li><p><span>特定节点命名规范：</span></p><ul><li><code>INIT</code><span>：初始状态</span></li><li><code>FINAL</code><span>：最终状态</span></li></ul></li><li><p><span>建议使用</span><code>方角矩形</code><span>节点来表示状态；</span></p></li><li><p><span>根据情况适当使用别名（如：A、B、C 等，可自由定义）；</span></p></li><li><p><span>可适当结合</span><code>菱形</code><span>节点用于表示</span><strong><span>分支</span></strong><span>和</span><strong><span>聚合</span></strong><span>。</span></p></li></ol><h6 id='旧版状态机图兼容性较高）'><span>旧版状态机图（兼容性较高）</span></h6><div class="md-diagram-panel md-fences-adv-panel"><svg id="mermaidChart7" width="100%" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" height="222" style="max-width: 1000.1546630859375px;" viewBox="-8 -8 1000.1546630859375 222" class="md-require-zoom-fix"><style>#mermaidChart7{font-family:sans-serif;font-size:16px;fill:#333;}#mermaidChart7 .error-icon{fill:#552222;}#mermaidChart7 .error-text{fill:#552222;stroke:#552222;}#mermaidChart7 .edge-thickness-normal{stroke-width:2px;}#mermaidChart7 .edge-thickness-thick{stroke-width:3.5px;}#mermaidChart7 .edge-pattern-solid{stroke-dasharray:0;}#mermaidChart7 .edge-pattern-dashed{stroke-dasharray:3;}#mermaidChart7 .edge-pattern-dotted{stroke-dasharray:2;}#mermaidChart7 .marker{fill:#333333;}#mermaidChart7 .marker.cross{stroke:#333333;}#mermaidChart7 svg{font-family:sans-serif;font-size:16px;}#mermaidChart7 .label{font-family:sans-serif;color:#333;}#mermaidChart7 .label text{fill:#333;}#mermaidChart7 .node rect,#mermaidChart7 .node circle,#mermaidChart7 .node ellipse,#mermaidChart7 .node polygon,#mermaidChart7 .node path{fill:#ECECFF;stroke:#9370DB;stroke-width:1px;}#mermaidChart7 .node .label{text-align:center;}#mermaidChart7 .node.clickable{cursor:pointer;}#mermaidChart7 .arrowheadPath{fill:#333333;}#mermaidChart7 .edgePath .path{stroke:#333333;stroke-width:1.5px;}#mermaidChart7 .flowchart-link{stroke:#333333;fill:none;}#mermaidChart7 .edgeLabel{background-color:#e8e8e8;text-align:center;}#mermaidChart7 .edgeLabel rect{opacity:0.5;background-color:#e8e8e8;fill:#e8e8e8;}#mermaidChart7 .cluster rect{fill:#ffffde;stroke:#aaaa33;stroke-width:1px;}#mermaidChart7 .cluster text{fill:#333;}#mermaidChart7 div.mermaidTooltip{position:absolute;text-align:center;max-width:200px;padding:2px;font-family:sans-serif;font-size:12px;background:hsl(80,100%,96.2745098039%);border:1px solid #aaaa33;border-radius:2px;pointer-events:none;z-index:100;}#mermaidChart7:root{--mermaid-font-family:sans-serif;}#mermaidChart7:root{--mermaid-alt-font-family:sans-serif;}#mermaidChart7 flowchart{fill:apa;}</style><g><g class="output"><g class="clusters"></g><g class="edgePaths"><g class="edgePath LS-INIT LE-A" id="L-INIT-A" style="opacity: 1;"><path class="path" d="M28,107L70.599609375,107L113.19921875,107" marker-end="url(#arrowhead264)" style="fill:none"></path><defs><marker id="arrowhead264" viewBox="0 0 10 10" refX="9" refY="5" markerUnits="strokeWidth" markerWidth="8" markerHeight="6" orient="auto"><path d="M 0 0 L 10 5 L 0 10 z" class="arrowheadPath" style="stroke-width: 1px; stroke-dasharray: 1px, 0px;"></path></marker></defs></g><g class="edgePath LS-A LE-fork1" id="L-A-fork1" style="opacity: 1;"><path class="path" d="M180.13827514648438,107L240.33944702148438,107L301.0406188964844,107.5" marker-end="url(#arrowhead265)" style="fill:none"></path><defs><marker id="arrowhead265" viewBox="0 0 10 10" refX="9" refY="5" markerUnits="strokeWidth" markerWidth="8" markerHeight="6" orient="auto"><path d="M 0 0 L 10 5 L 0 10 z" class="arrowheadPath" style="stroke-width: 1px; stroke-dasharray: 1px, 0px;"></path></marker></defs></g><g class="edgePath LS-fork1 LE-B" id="L-fork1-B" style="opacity: 1;"><path class="path" d="M329.35396817500833,99.81334927852393L414.3394470214844,35.60009765625L557.9187469482422,35.60009765625" marker-end="url(#arrowhead266)" style="fill:none"></path><defs><marker id="arrowhead266" viewBox="0 0 10 10" refX="9" refY="5" markerUnits="strokeWidth" markerWidth="8" markerHeight="6" orient="auto"><path d="M 0 0 L 10 5 L 0 10 z" class="arrowheadPath" style="stroke-width: 1px; stroke-dasharray: 1px, 0px;"></path></marker></defs></g><g class="edgePath LS-B LE-C" id="L-B-C" style="opacity: 1;"><path class="path" d="M624.8578033447266,35.60009765625L768.4371032714844,35.60009765625L846.2359313964844,60.45209183604691" marker-end="url(#arrowhead267)" style="fill:none"></path><defs><marker id="arrowhead267" viewBox="0 0 10 10" refX="9" refY="5" markerUnits="strokeWidth" markerWidth="8" markerHeight="6" orient="auto"><path d="M 0 0 L 10 5 L 0 10 z" class="arrowheadPath" style="stroke-width: 1px; stroke-dasharray: 1px, 0px;"></path></marker></defs></g><g class="edgePath LS-fork1 LE-C" id="L-fork1-C" style="opacity: 1;"><path class="path" d="M337.0406188964844,107.5L414.3394470214844,107L591.3882751464844,107L768.4371032714844,107L846.2359313964844,82.1480058202031" marker-end="url(#arrowhead268)" style="fill:none;stroke-width:2px;stroke-dasharray:3;"></path><defs><marker id="arrowhead268" viewBox="0 0 10 10" refX="9" refY="5" markerUnits="strokeWidth" markerWidth="8" markerHeight="6" orient="auto"><path d="M 0 0 L 10 5 L 0 10 z" class="arrowheadPath" style="stroke-width: 1px; stroke-dasharray: 1px, 0px;"></path></marker></defs></g><g class="edgePath LS-C LE-FINAL" id="L-C-FINAL" style="opacity: 1;"><path class="path" d="M914.1546936035156,71.300048828125L939.1546936035156,71.300048828125L968.6150059997262,115.57477194310528" marker-end="url(#arrowhead269)" style="fill:none"></path><defs><marker id="arrowhead269" viewBox="0 0 10 10" refX="9" refY="5" markerUnits="strokeWidth" markerWidth="8" markerHeight="6" orient="auto"><path d="M 0 0 L 10 5 L 0 10 z" class="arrowheadPath" style="stroke-width: 1px; stroke-dasharray: 1px, 0px;"></path></marker></defs></g><g class="edgePath LS-fork1 LE-D" id="L-fork1-D" style="opacity: 1;"><path class="path" d="M329.35396817500833,115.18665072147607L414.3394470214844,178.39990234375L591.3882751464844,178.39990234375L768.4371032714844,178.39990234375L846.2359313964844,178.39990234375" marker-end="url(#arrowhead270)" style="fill:none;stroke-width:2px;stroke-dasharray:3;"></path><defs><marker id="arrowhead270" viewBox="0 0 10 10" refX="9" refY="5" markerUnits="strokeWidth" markerWidth="8" markerHeight="6" orient="auto"><path d="M 0 0 L 10 5 L 0 10 z" class="arrowheadPath" style="stroke-width: 1px; stroke-dasharray: 1px, 0px;"></path></marker></defs></g><g class="edgePath LS-D LE-FINAL" id="L-D-FINAL" style="opacity: 1;"><path class="path" d="M914.1546936035156,178.39990234375L939.1546936035156,178.39990234375L968.751002703205,132.3144274788451" marker-end="url(#arrowhead271)" style="fill:none"></path><defs><marker id="arrowhead271" viewBox="0 0 10 10" refX="9" refY="5" markerUnits="strokeWidth" markerWidth="8" markerHeight="6" orient="auto"><path d="M 0 0 L 10 5 L 0 10 z" class="arrowheadPath" style="stroke-width: 1px; stroke-dasharray: 1px, 0px;"></path></marker></defs></g></g><g class="edgeLabels"><g class="edgeLabel" transform="translate(70.599609375,107)" style="opacity: 1;"><g transform="translate(-17.599609375,-8.7998046875)" class="label"><rect rx="0" ry="0" width="35.19921875" height="17.599609375"></rect><foreignObject width="35.19921875" height="17.599609375"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; white-space: nowrap;"><span>初始</span></div></foreignObject></g></g><g class="edgeLabel" transform="translate(240.33944702148438,107)" style="opacity: 1;"><g transform="translate(-35.201171875,-8.7998046875)" class="label"><rect rx="0" ry="0" width="70.40234375" height="17.599609375"></rect><foreignObject width="70.40234375" height="17.599609375"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; white-space: nowrap;"><span>复杂变更</span></div></foreignObject></g></g><g class="edgeLabel" transform="translate(414.3394470214844,35.60009765625)" style="opacity: 1;"><g transform="translate(-52.798828125,-8.7998046875)" class="label"><rect rx="0" ry="0" width="105.59765625" height="17.599609375"></rect><foreignObject width="105.59765625" height="17.599609375"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; white-space: nowrap;"><span>变更条件说明</span></div></foreignObject></g></g><g class="edgeLabel" transform="translate(768.4371032714844,35.60009765625)" style="opacity: 1;"><g transform="translate(-52.798828125,-8.7998046875)" class="label"><rect rx="0" ry="0" width="105.59765625" height="17.599609375"></rect><foreignObject width="105.59765625" height="17.599609375"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; white-space: nowrap;"><span>变更条件说明</span></div></foreignObject></g></g><g class="edgeLabel" transform="translate(591.3882751464844,107)" style="opacity: 1;"><g transform="translate(-99.25,-8.7998046875)" class="label"><rect rx="0" ry="0" width="198.5" height="17.599609375"></rect><foreignObject width="198.5" height="17.599609375"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; white-space: nowrap;"><span>非正常/次要变更条件说明</span></div></foreignObject></g></g><g class="edgeLabel" transform="" style="opacity: 1;"><g transform="translate(0,0)" class="label"><rect rx="0" ry="0" width="0" height="0"></rect><foreignObject width="0" height="0"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; white-space: nowrap;"><span></span></div></foreignObject></g></g><g class="edgeLabel" transform="translate(591.3882751464844,178.39990234375)" style="opacity: 1;"><g transform="translate(-99.25,-8.7998046875)" class="label"><rect rx="0" ry="0" width="198.5" height="17.599609375"></rect><foreignObject width="198.5" height="17.599609375"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; white-space: nowrap;"><span>非正常/次要变更条件说明</span></div></foreignObject></g></g><g class="edgeLabel" transform="" style="opacity: 1;"><g transform="translate(0,0)" class="label"><rect rx="0" ry="0" width="0" height="0"></rect><foreignObject width="0" height="0"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; white-space: nowrap;"><span></span></div></foreignObject></g></g></g><g class="nodes"><g class="node default" id="flowchart-INIT-58" transform="translate(18,107)" style="opacity: 1;"><circle x="-10" y="-10" r="10" class="label-container"></circle><g class="label" transform="translate(0,0)"><g transform="translate(0,0)"><foreignObject width="0" height="0"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; white-space: nowrap;"></div></foreignObject></g></g></g><g class="node default" id="flowchart-A-59" transform="translate(146.6687469482422,107)" style="opacity: 1;"><rect rx="0" ry="0" x="-33.46952819824219" y="-27.60009765625" width="66.93905639648438" height="55.2001953125" class="label-container"></rect><g class="label" transform="translate(0,0)"><g transform="translate(-23.469528198242188,-17.60009765625)"><foreignObject width="46.939056396484375" height="35.2001953125"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; white-space: nowrap;">状态A</div></foreignObject></g></g></g><g class="node default" id="flowchart-fork1-61" transform="translate(318.5406188964844,107)" style="opacity: 1;"><polygon points="18,0 36,-18 18,-36 0,-18" transform="translate(-18,18)" class="label-container"></polygon><g class="label" transform="translate(0,0)"><g transform="translate(0,0)"><foreignObject width="0" height="0"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; white-space: nowrap;"></div></foreignObject></g></g></g><g class="node default" id="flowchart-B-63" transform="translate(591.3882751464844,35.60009765625)" style="opacity: 1;"><rect rx="0" ry="0" x="-33.46952819824219" y="-27.60009765625" width="66.93905639648438" height="55.2001953125" class="label-container"></rect><g class="label" transform="translate(0,0)"><g transform="translate(-23.469528198242188,-17.60009765625)"><foreignObject width="46.939056396484375" height="35.2001953125"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; white-space: nowrap;">状态B</div></foreignObject></g></g></g><g class="node default" id="flowchart-C-65" transform="translate(880.1953125,71.300048828125)" style="opacity: 1;"><rect rx="0" ry="0" x="-33.959381103515625" y="-27.60009765625" width="67.91876220703125" height="55.2001953125" class="label-container"></rect><g class="label" transform="translate(0,0)"><g transform="translate(-23.959381103515625,-17.60009765625)"><foreignObject width="47.91876220703125" height="35.2001953125"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; white-space: nowrap;">状态C</div></foreignObject></g></g></g><g class="node default" id="flowchart-FINAL-69" transform="translate(974.1546936035156,123.900146484375)" style="opacity: 1;"><circle x="-10" y="-10" r="10" class="label-container"></circle><g class="label" transform="translate(0,0)"><g transform="translate(0,0)"><foreignObject width="0" height="0"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; white-space: nowrap;"></div></foreignObject></g></g></g><g class="node default" id="flowchart-D-71" transform="translate(880.1953125,178.39990234375)" style="opacity: 1;"><rect rx="0" ry="0" x="-33.959381103515625" y="-27.60009765625" width="67.91876220703125" height="55.2001953125" class="label-container"></rect><g class="label" transform="translate(0,0)"><g transform="translate(-23.959381103515625,-17.60009765625)"><foreignObject width="47.91876220703125" height="35.2001953125"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; white-space: nowrap;">状态D</div></foreignObject></g></g></g></g></g></g></svg></div><h6 id='以上状态机图的画图脚本示例-3'><span>以上「状态机图」的画图脚本示例</span></h6><pre class="md-fences md-end-block md-fences-with-lineno ty-contain-cm modeLoaded" spellcheck="false" lang="" style="break-inside: unset;"><div class="CodeMirror cm-s-inner cm-s-null-scroll CodeMirror-wrap" lang=""><div style="overflow: hidden; position: relative; width: 3px; height: 0px; top: 12.545454025268555px; left: 40.99432373046875px;"><textarea autocorrect="off" autocapitalize="off" spellcheck="false" tabindex="0" style="position: absolute; bottom: -1em; padding: 0px; width: 1000px; height: 1em; outline: none;"></textarea></div><div class="CodeMirror-scrollbar-filler" cm-not-content="true"></div><div class="CodeMirror-gutter-filler" cm-not-content="true"></div><div class="CodeMirror-scroll" tabindex="-1"><div class="CodeMirror-sizer" style="margin-left: 31px; margin-bottom: 0px; border-right-width: 0px; padding-right: 0px; padding-bottom: 0px;"><div style="position: relative; top: 0px;"><div class="CodeMirror-lines" role="presentation"><div role="presentation" style="position: relative; outline: none;"><div class="CodeMirror-measure"><pre><span>xxxxxxxxxx</span></pre><div class="CodeMirror-linenumber CodeMirror-gutter-elt"><div>15</div></div></div><div class="CodeMirror-measure"></div><div style="position: relative; z-index: 1;"></div><div class="CodeMirror-code" role="presentation" style=""><div class="CodeMirror-activeline" style="position: relative;"><div class="CodeMirror-activeline-background CodeMirror-linebackground"></div><div class="CodeMirror-gutter-background CodeMirror-activeline-gutter" style="left: -30.99432373046875px; width: 31px;"></div><div class="CodeMirror-gutter-wrapper CodeMirror-activeline-gutter" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt CodeMirror-linenumber-show" style="left: 0px; width: 22px;">1</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">```mermaid</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">2</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">graph LR</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">3</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">%% 流程图走方说明</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">4</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">%% LR：从左到图，RL：从右到左，TB：从上到下，BT：从下到上</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">5</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"><span cm-text="" cm-zwsp="">
</span></span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">6</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">INIT(( )) --&gt; |初始|A[状态A]</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">7</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">A --&gt; |复杂变更|fork1(( ))</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">8</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">fork1(( )) --&gt; |变更条件说明|B[状态B]</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">9</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">B --&gt; |变更条件说明|C[状态C]</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt CodeMirror-linenumber-show" style="left: 0px; width: 22px;">10</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">fork1{ } -.-&gt; |非正常/次要变更条件说明|C</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">11</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">C --&gt; FINAL</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">12</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">fork1{ } -.-&gt; |非正常/次要变更条件说明|D[状态D]</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">13</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">D --&gt; FINAL</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">14</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">FINAL(( ))</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt CodeMirror-linenumber-show" style="left: 0px; width: 22px;">15</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"><span class="cm-invalidchar" title="\u200b" aria-label="\u200b" cm-text="​">•</span>```</span></pre></div></div></div></div></div></div><div style="position: absolute; height: 0px; width: 1px; border-bottom-width: 0px; border-bottom-style: solid; border-bottom-color: transparent; top: 436px;"></div><div class="CodeMirror-gutters" style="height: 436px;"><div class="CodeMirror-gutter CodeMirror-linenumbers" style="width: 30px;"></div></div></div></div></pre><h2 id='甘特图'><span>甘特图</span></h2><h6 id='甘特图示例'><span>甘特图示例</span></h6><div class="md-diagram-panel md-fences-adv-panel"><svg id="mermaidChart8" width="100%" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1015 292" height="292" style="max-width: 1015px;" class="md-require-zoom-fix"><style>#mermaidChart8{font-family:sans-serif;font-size:16px;fill:#333;}#mermaidChart8 .error-icon{fill:#552222;}#mermaidChart8 .error-text{fill:#552222;stroke:#552222;}#mermaidChart8 .edge-thickness-normal{stroke-width:2px;}#mermaidChart8 .edge-thickness-thick{stroke-width:3.5px;}#mermaidChart8 .edge-pattern-solid{stroke-dasharray:0;}#mermaidChart8 .edge-pattern-dashed{stroke-dasharray:3;}#mermaidChart8 .edge-pattern-dotted{stroke-dasharray:2;}#mermaidChart8 .marker{fill:#333333;}#mermaidChart8 .marker.cross{stroke:#333333;}#mermaidChart8 svg{font-family:sans-serif;font-size:16px;}#mermaidChart8 .mermaid-main-font{font-family:"trebuchet ms",verdana,arial;font-family:var(--mermaid-font-family);}#mermaidChart8 .section{stroke:none;opacity:0.2;}#mermaidChart8 .section0{fill:rgba(102,102,255,0.49);}#mermaidChart8 .section2{fill:#fff400;}#mermaidChart8 .section1,#mermaidChart8 .section3{fill:white;opacity:0.2;}#mermaidChart8 .sectionTitle0{fill:#333;}#mermaidChart8 .sectionTitle1{fill:#333;}#mermaidChart8 .sectionTitle2{fill:#333;}#mermaidChart8 .sectionTitle3{fill:#333;}#mermaidChart8 .sectionTitle{text-anchor:start;font-size:11px;text-height:14px;font-family:'trebuchet ms',verdana,arial;font-family:var(--mermaid-font-family);}#mermaidChart8 .grid .tick{stroke:lightgrey;opacity:0.8;shape-rendering:crispEdges;}#mermaidChart8 .grid .tick text{font-family:sans-serif;fill:#333;}#mermaidChart8 .grid path{stroke-width:0;}#mermaidChart8 .today{fill:none;stroke:red;stroke-width:2px;}#mermaidChart8 .task{stroke-width:2;}#mermaidChart8 .taskText{text-anchor:middle;font-family:'trebuchet ms',verdana,arial;font-family:var(--mermaid-font-family);}#mermaidChart8 .taskText:not([font-size]){font-size:11px;}#mermaidChart8 .taskTextOutsideRight{fill:black;text-anchor:start;font-size:11px;font-family:'trebuchet ms',verdana,arial;font-family:var(--mermaid-font-family);}#mermaidChart8 .taskTextOutsideLeft{fill:black;text-anchor:end;font-size:11px;}#mermaidChart8 .task.clickable{cursor:pointer;}#mermaidChart8 .taskText.clickable{cursor:pointer;fill:#003163 !important;font-weight:bold;}#mermaidChart8 .taskTextOutsideLeft.clickable{cursor:pointer;fill:#003163 !important;font-weight:bold;}#mermaidChart8 .taskTextOutsideRight.clickable{cursor:pointer;fill:#003163 !important;font-weight:bold;}#mermaidChart8 .taskText0,#mermaidChart8 .taskText1,#mermaidChart8 .taskText2,#mermaidChart8 .taskText3{fill:white;}#mermaidChart8 .task0,#mermaidChart8 .task1,#mermaidChart8 .task2,#mermaidChart8 .task3{fill:#8a90dd;stroke:#534fbc;}#mermaidChart8 .taskTextOutside0,#mermaidChart8 .taskTextOutside2{fill:black;}#mermaidChart8 .taskTextOutside1,#mermaidChart8 .taskTextOutside3{fill:black;}#mermaidChart8 .active0,#mermaidChart8 .active1,#mermaidChart8 .active2,#mermaidChart8 .active3{fill:#bfc7ff;stroke:#534fbc;}#mermaidChart8 .activeText0,#mermaidChart8 .activeText1,#mermaidChart8 .activeText2,#mermaidChart8 .activeText3{fill:black !important;}#mermaidChart8 .done0,#mermaidChart8 .done1,#mermaidChart8 .done2,#mermaidChart8 .done3{stroke:grey;fill:lightgrey;stroke-width:2;}#mermaidChart8 .doneText0,#mermaidChart8 .doneText1,#mermaidChart8 .doneText2,#mermaidChart8 .doneText3{fill:black !important;}#mermaidChart8 .crit0,#mermaidChart8 .crit1,#mermaidChart8 .crit2,#mermaidChart8 .crit3{stroke:#ff8888;fill:red;stroke-width:2;}#mermaidChart8 .activeCrit0,#mermaidChart8 .activeCrit1,#mermaidChart8 .activeCrit2,#mermaidChart8 .activeCrit3{stroke:#ff8888;fill:#bfc7ff;stroke-width:2;}#mermaidChart8 .doneCrit0,#mermaidChart8 .doneCrit1,#mermaidChart8 .doneCrit2,#mermaidChart8 .doneCrit3{stroke:#ff8888;fill:lightgrey;stroke-width:2;cursor:pointer;shape-rendering:crispEdges;}#mermaidChart8 .milestone{-webkit-transform:rotate(45deg) scale(0.8,0.8);-ms-transform:rotate(45deg) scale(0.8,0.8);transform:rotate(45deg) scale(0.8,0.8);}#mermaidChart8 .milestoneText{font-style:italic;}#mermaidChart8 .doneCritText0,#mermaidChart8 .doneCritText1,#mermaidChart8 .doneCritText2,#mermaidChart8 .doneCritText3{fill:black !important;}#mermaidChart8 .activeCritText0,#mermaidChart8 .activeCritText1,#mermaidChart8 .activeCritText2,#mermaidChart8 .activeCritText3{fill:black !important;}#mermaidChart8 .titleText{text-anchor:middle;font-size:18px;fill:var(--text-color);font-family:'trebuchet ms',verdana,arial;font-family:var(--mermaid-font-family);}#mermaidChart8:root{--mermaid-font-family:sans-serif;}#mermaidChart8:root{--mermaid-alt-font-family:sans-serif;}#mermaidChart8 gantt{fill:apa;}</style><g></g><g class="grid" transform="translate(75, 242)" fill="none" font-size="10" font-family="sans-serif" text-anchor="middle"><path class="domain" stroke="currentColor" d="M0.5,-207V0.5H920.5V-207"></path><g class="tick" opacity="1" transform="translate(0.5,0)"><line stroke="currentColor" y2="-207"></line><text fill="#000" y="3" dy="1em" stroke="none" font-size="10" style="text-anchor: middle;">2014-01-06</text></g><g class="tick" opacity="1" transform="translate(92.5,0)"><line stroke="currentColor" y2="-207"></line><text fill="#000" y="3" dy="1em" stroke="none" font-size="10" style="text-anchor: middle;">2014-01-07</text></g><g class="tick" opacity="1" transform="translate(184.5,0)"><line stroke="currentColor" y2="-207"></line><text fill="#000" y="3" dy="1em" stroke="none" font-size="10" style="text-anchor: middle;">2014-01-08</text></g><g class="tick" opacity="1" transform="translate(276.5,0)"><line stroke="currentColor" y2="-207"></line><text fill="#000" y="3" dy="1em" stroke="none" font-size="10" style="text-anchor: middle;">2014-01-09</text></g><g class="tick" opacity="1" transform="translate(368.5,0)"><line stroke="currentColor" y2="-207"></line><text fill="#000" y="3" dy="1em" stroke="none" font-size="10" style="text-anchor: middle;">2014-01-10</text></g><g class="tick" opacity="1" transform="translate(460.5,0)"><line stroke="currentColor" y2="-207"></line><text fill="#000" y="3" dy="1em" stroke="none" font-size="10" style="text-anchor: middle;">2014-01-11</text></g><g class="tick" opacity="1" transform="translate(552.5,0)"><line stroke="currentColor" y2="-207"></line><text fill="#000" y="3" dy="1em" stroke="none" font-size="10" style="text-anchor: middle;">2014-01-12</text></g><g class="tick" opacity="1" transform="translate(644.5,0)"><line stroke="currentColor" y2="-207"></line><text fill="#000" y="3" dy="1em" stroke="none" font-size="10" style="text-anchor: middle;">2014-01-13</text></g><g class="tick" opacity="1" transform="translate(736.5,0)"><line stroke="currentColor" y2="-207"></line><text fill="#000" y="3" dy="1em" stroke="none" font-size="10" style="text-anchor: middle;">2014-01-14</text></g><g class="tick" opacity="1" transform="translate(828.5,0)"><line stroke="currentColor" y2="-207"></line><text fill="#000" y="3" dy="1em" stroke="none" font-size="10" style="text-anchor: middle;">2014-01-15</text></g><g class="tick" opacity="1" transform="translate(920.5,0)"><line stroke="currentColor" y2="-207"></line><text fill="#000" y="3" dy="1em" stroke="none" font-size="10" style="text-anchor: middle;">2014-01-16</text></g></g><g><rect x="0" y="48" width="1005" height="24" class="section section0"></rect><rect x="0" y="144" width="1005" height="24" class="section section1"></rect><rect x="0" y="168" width="1005" height="24" class="section section1"></rect><rect x="0" y="72" width="1005" height="24" class="section section0"></rect><rect x="0" y="192" width="1005" height="24" class="section section2"></rect><rect x="0" y="96" width="1005" height="24" class="section section0"></rect><rect x="0" y="216" width="1005" height="24" class="section section2"></rect><rect x="0" y="120" width="1005" height="24" class="section section0"></rect></g><g><rect id="des1" rx="3" ry="3" x="75" y="50" width="184" height="20" transform-origin="167px 60px" class="task done0 "></rect><rect id="task1" rx="3" ry="3" x="75" y="146" width="92" height="20" transform-origin="121px 84px" class="task doneCrit1 "></rect><rect id="task2" rx="3" ry="3" x="259" y="170" width="184" height="20" transform-origin="351px 108px" class="task doneCrit1 "></rect><rect id="des2" rx="3" ry="3" x="351" y="74" width="276" height="20" transform-origin="489px 132px" class="task active0 "></rect><rect id="task3" rx="3" ry="3" x="443" y="194" width="276" height="20" transform-origin="581px 156px" class="task activeCrit2 "></rect><rect id="des3" rx="3" ry="3" x="627" y="98" width="184" height="20" transform-origin="719px 180px" class="task task0 "></rect><rect id="task4" rx="3" ry="3" x="719" y="218" width="184" height="20" transform-origin="811px 204px" class="task crit2 "></rect><rect id="des4" rx="3" ry="3" x="811" y="122" width="184" height="20" transform-origin="903px 228px" class="task task0 "></rect><text id="des1-text" font-size="11" x="167" y="63.5" text-height="20" class=" taskText taskText0  doneText0 width-87.671875">已完成的普通任务</text><text id="task1-text" font-size="11" x="172" y="159.5" text-height="20" class=" taskTextOutsideRight taskTextOutside1  doneCritText1 width-109.59375">已完成的关键路径任务</text><text id="task2-text" font-size="11" x="351" y="183.5" text-height="20" class=" taskText taskText1  doneCritText1 width-115.6875">已完成的关键路径任务2</text><text id="des2-text" font-size="11" x="489" y="87.5" text-height="20" class=" taskText taskText0 activeText0 width-87.671875">执行中的普通任务</text><text id="task3-text" font-size="11" x="581" y="207.5" text-height="20" class=" taskText taskText2 activeCritText2 critText2 width-109.59375">执行中的关键路径任务</text><text id="des3-text" font-size="11" x="719" y="111.5" text-height="20" class=" taskText taskText0  width-54.796875">未来的任务</text><text id="task4-text" font-size="11" x="811" y="231.5" text-height="20" class=" taskText taskText2  critText2 width-98.625">未来的关键路径任务</text><text id="des4-text" font-size="11" x="903" y="135.5" text-height="20" class=" taskText taskText0  width-60.890625">未来的任务2</text></g><g><text dy="0em" x="10" y="98" class="sectionTitle sectionTitle0"><tspan alignment-baseline="central" x="10">区块A</tspan></text><text dy="0em" x="10" y="170" class="sectionTitle sectionTitle1"><tspan alignment-baseline="central" x="10">区块B</tspan></text><text dy="0em" x="10" y="218" class="sectionTitle sectionTitle2"><tspan alignment-baseline="central" x="10">区块C</tspan></text></g><g class="today"><line x1="258741" x2="258741" y1="25" y2="267" class="today"></line></g><text x="507.5" y="25" class="titleText">这里显示甘特图标题</text></svg></div><h6 id='以上甘特图的画图脚本示例'><span>![以上「甘特图」的画图脚本示例]</span></h6><pre class="md-fences md-end-block md-fences-with-lineno ty-contain-cm modeLoaded" spellcheck="false" lang="" style="break-inside: unset;"><div class="CodeMirror cm-s-inner cm-s-null-scroll CodeMirror-wrap" lang=""><div style="overflow: hidden; position: relative; width: 3px; height: 0px; top: 12.545454025268555px; left: 40.99432373046875px;"><textarea autocorrect="off" autocapitalize="off" spellcheck="false" tabindex="0" style="position: absolute; bottom: -1em; padding: 0px; width: 1000px; height: 1em; outline: none;"></textarea></div><div class="CodeMirror-scrollbar-filler" cm-not-content="true"></div><div class="CodeMirror-gutter-filler" cm-not-content="true"></div><div class="CodeMirror-scroll" tabindex="-1"><div class="CodeMirror-sizer" style="margin-left: 31px; margin-bottom: 0px; border-right-width: 0px; padding-right: 0px; padding-bottom: 0px;"><div style="position: relative; top: 0px;"><div class="CodeMirror-lines" role="presentation"><div role="presentation" style="position: relative; outline: none;"><div class="CodeMirror-measure"><pre><span>xxxxxxxxxx</span></pre><div class="CodeMirror-linenumber CodeMirror-gutter-elt"><div>21</div></div></div><div class="CodeMirror-measure"></div><div style="position: relative; z-index: 1;"></div><div class="CodeMirror-code" role="presentation" style=""><div class="CodeMirror-activeline" style="position: relative;"><div class="CodeMirror-activeline-background CodeMirror-linebackground"></div><div class="CodeMirror-gutter-background CodeMirror-activeline-gutter" style="left: -30.99432373046875px; width: 31px;"></div><div class="CodeMirror-gutter-wrapper CodeMirror-activeline-gutter" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt CodeMirror-linenumber-show" style="left: 0px; width: 22px;">1</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">```mermaid</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">2</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">gantt</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">3</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">dateFormat  YYYY-MM-DD</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">4</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">title 这里显示甘特图标题</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">5</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"><span cm-text="" cm-zwsp="">
</span></span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">6</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">%% this is a comment</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">7</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"><span cm-text="" cm-zwsp="">
</span></span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">8</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">section 区块A</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">9</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">已完成的任务:done, des1, 2014-01-06, 2014-01-08</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt CodeMirror-linenumber-show" style="left: 0px; width: 22px;">10</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">执行中的任务:active, des2, 2014-01-09, 3d</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">11</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">未来的任务:des3, after des2, 5d</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">12</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">未来的任务2:des4, after des3, 5d</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">13</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"><span cm-text="" cm-zwsp="">
</span></span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">14</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">section 区块B</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">15</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">已完成的关键路径任务:crit, done, 2014-01-06, 24h</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">16</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">已完成的关键路径任务2:crit, done, after des1, 2d</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">17</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"><span cm-text="" cm-zwsp="">
</span></span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">18</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">section 区块C</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">19</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">执行中的关键路径任务:crit, active, 3d</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt CodeMirror-linenumber-show" style="left: 0px; width: 22px;">20</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">未来的关键路径任务:crit, 5d</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt CodeMirror-linenumber-show" style="left: 0px; width: 22px;">21</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"><span class="cm-invalidchar" title="\u200b" aria-label="\u200b" cm-text="​">•</span>```</span></pre></div></div></div></div></div></div><div style="position: absolute; height: 0px; width: 1px; border-bottom-width: 0px; border-bottom-style: solid; border-bottom-color: transparent; top: 611px;"></div><div class="CodeMirror-gutters" style="height: 611px;"><div class="CodeMirror-gutter CodeMirror-linenumbers" style="width: 30px;"></div></div></div></div></pre><h2 id='饼图'><span>饼图</span></h2><h6 id='q3-2019-中国线上智能手机市场主要品牌市场份额数据来自互联网'><span>![Q3 2019 中国线上智能手机市场主要品牌市场份额]&quot;数据来自：互联网&quot;</span></h6><div class="md-diagram-panel md-fences-adv-panel"><svg id="mermaidChart9" width="100%" xmlns="http://www.w3.org/2000/svg" height="450" style="max-width: 1015px;" viewBox="0 0 1015 450" class="md-require-zoom-fix"><style>#mermaidChart9{font-family:sans-serif;font-size:16px;fill:#333;}#mermaidChart9 .error-icon{fill:#552222;}#mermaidChart9 .error-text{fill:#552222;stroke:#552222;}#mermaidChart9 .edge-thickness-normal{stroke-width:2px;}#mermaidChart9 .edge-thickness-thick{stroke-width:3.5px;}#mermaidChart9 .edge-pattern-solid{stroke-dasharray:0;}#mermaidChart9 .edge-pattern-dashed{stroke-dasharray:3;}#mermaidChart9 .edge-pattern-dotted{stroke-dasharray:2;}#mermaidChart9 .marker{fill:#333333;}#mermaidChart9 .marker.cross{stroke:#333333;}#mermaidChart9 svg{font-family:sans-serif;font-size:16px;}#mermaidChart9 .pieTitleText{text-anchor:middle;font-size:25px;fill:black;font-family:sans-serif;}#mermaidChart9 .slice{font-family:sans-serif;fill:#333;}#mermaidChart9 .legend text{fill:black;font-family:sans-serif;font-size:17px;}#mermaidChart9:root{--mermaid-font-family:sans-serif;}#mermaidChart9:root{--mermaid-alt-font-family:sans-serif;}#mermaidChart9 pie{fill:apa;}</style><g></g><g transform="translate(507.5,225)"><path d="M1.1327982892113017e-14,-185A185,185,0,0,1,184.63494475923025,11.61624611292299L0,0Z" fill="#66c2a5" stroke="black" style="stroke-width: 2px; opacity: 0.7;"></path><path d="M184.63494475923025,11.61624611292299A185,185,0,0,1,46.00762912549813,179.18788480879675L0,0Z" fill="#fc8d62" stroke="black" style="stroke-width: 2px; opacity: 0.7;"></path><path d="M-126.64121459680742,134.85919607296114A185,185,0,0,1,-184.63494475923025,-11.616246112923049L0,0Z" fill="#8da0cb" stroke="black" style="stroke-width: 2px; opacity: 0.7;"></path><path d="M-184.63494475923025,-11.616246112923049A185,185,0,0,1,-142.54494991352098,-117.92343810350765L0,0Z" fill="#e78ac3" stroke="black" style="stroke-width: 2px; opacity: 0.7;"></path><path d="M-142.54494991352098,-117.92343810350765A185,185,0,0,1,-57.168143959365146,-175.94545551460345L0,0Z" fill="#a6d854" stroke="black" style="stroke-width: 2px; opacity: 0.7;"></path><path d="M-57.168143959365146,-175.94545551460345A185,185,0,0,1,1.303290589681841e-13,-185L0,0Z" fill="#ffd92f" stroke="black" style="stroke-width: 2px; opacity: 0.7;"></path><path d="M46.00762912549813,179.18788480879675A185,185,0,0,1,-126.64121459680742,134.85919607296114L0,0Z" fill="#e5c494" stroke="black" style="stroke-width: 2px; opacity: 0.7;"></path><text transform="translate(67.42959803648057,-63.320607298403694)" class="slice" style="text-anchor: middle; font-size: 17px;">26%</text><text transform="translate(71.27247495676049,58.9617190517538)" class="slice" style="text-anchor: middle; font-size: 17px;">20%</text><text transform="translate(-86.00432494466325,34.051521123332684)" class="slice" style="text-anchor: middle; font-size: 17px;">14%</text><text transform="translate(-86.00432494466324,-34.05152112333275)" class="slice" style="text-anchor: middle; font-size: 17px;">10%</text><text transform="translate(-51.992712451322035,-76.504953120397)" class="slice" style="text-anchor: middle; font-size: 17px;">9%</text><text transform="translate(-14.470188016221291,-91.36117150505025)" class="slice" style="text-anchor: middle; font-size: 17px;">5%</text><text transform="translate(-23.003814562749096,89.59394240439838)" class="slice" style="text-anchor: middle; font-size: 17px;">16%</text><text x="0" y="-200" class="pieTitleText">Q3 2019 中国线上智能手机市场主要品牌市场份额</text><g class="legend" transform="translate(216,-77)"><rect width="18" height="18" style="fill: rgb(102, 194, 165); stroke: rgb(102, 194, 165);"></rect><text x="22" y="14">华为</text></g><g class="legend" transform="translate(216,-55)"><rect width="18" height="18" style="fill: rgb(252, 141, 98); stroke: rgb(252, 141, 98);"></rect><text x="22" y="14">荣耀</text></g><g class="legend" transform="translate(216,-33)"><rect width="18" height="18" style="fill: rgb(141, 160, 203); stroke: rgb(141, 160, 203);"></rect><text x="22" y="14">小米</text></g><g class="legend" transform="translate(216,-11)"><rect width="18" height="18" style="fill: rgb(231, 138, 195); stroke: rgb(231, 138, 195);"></rect><text x="22" y="14">VIVO</text></g><g class="legend" transform="translate(216,11)"><rect width="18" height="18" style="fill: rgb(166, 216, 84); stroke: rgb(166, 216, 84);"></rect><text x="22" y="14">Apple</text></g><g class="legend" transform="translate(216,33)"><rect width="18" height="18" style="fill: rgb(255, 217, 47); stroke: rgb(255, 217, 47);"></rect><text x="22" y="14">OPPO</text></g><g class="legend" transform="translate(216,55)"><rect width="18" height="18" style="fill: rgb(229, 196, 148); stroke: rgb(229, 196, 148);"></rect><text x="22" y="14">其他</text></g></g></svg></div><h6 id='以上饼图的画图脚本示例'><span>以上「饼图」的画图脚本示例</span></h6><pre class="md-fences md-end-block md-fences-with-lineno ty-contain-cm modeLoaded" spellcheck="false" lang=""><div class="CodeMirror cm-s-inner cm-s-null-scroll CodeMirror-wrap" lang=""><div style="overflow: hidden; position: relative; width: 3px; height: 0px; top: 12.545454025268555px; left: 40.99432373046875px;"><textarea autocorrect="off" autocapitalize="off" spellcheck="false" tabindex="0" style="position: absolute; bottom: -1em; padding: 0px; width: 1000px; height: 1em; outline: none;"></textarea></div><div class="CodeMirror-scrollbar-filler" cm-not-content="true"></div><div class="CodeMirror-gutter-filler" cm-not-content="true"></div><div class="CodeMirror-scroll" tabindex="-1"><div class="CodeMirror-sizer" style="margin-left: 31px; margin-bottom: 0px; border-right-width: 0px; padding-right: 0px; padding-bottom: 0px;"><div style="position: relative; top: 0px;"><div class="CodeMirror-lines" role="presentation"><div role="presentation" style="position: relative; outline: none;"><div class="CodeMirror-measure"><pre><span>xxxxxxxxxx</span></pre><div class="CodeMirror-linenumber CodeMirror-gutter-elt"><div>10</div></div></div><div class="CodeMirror-measure"></div><div style="position: relative; z-index: 1;"></div><div class="CodeMirror-code" role="presentation" style=""><div class="CodeMirror-activeline" style="position: relative;"><div class="CodeMirror-activeline-background CodeMirror-linebackground"></div><div class="CodeMirror-gutter-background CodeMirror-activeline-gutter" style="left: -30.99432373046875px; width: 31px;"></div><div class="CodeMirror-gutter-wrapper CodeMirror-activeline-gutter" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt CodeMirror-linenumber-show" style="left: 0px; width: 22px;">1</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">```mermaid</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">2</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">pie title Q3 2019 中国线上智能手机市场主要品牌市场份额</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">3</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">"华为" : 26</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">4</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">"荣耀" : 20</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">5</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">"小米" : 14</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">6</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">"VIVO" : 10</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">7</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">"Apple" : 9</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">8</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">"OPPO" : 5</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 22px;">9</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">"其他" : 16</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30.99432373046875px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt CodeMirror-linenumber-show" style="left: 0px; width: 22px;">10</div></div><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"><span class="cm-invalidchar" title="\u200b" aria-label="\u200b" cm-text="​">•</span>```</span></pre></div></div></div></div></div></div><div style="position: absolute; height: 0px; width: 1px; border-bottom-width: 0px; border-bottom-style: solid; border-bottom-color: transparent; top: 291px;"></div><div class="CodeMirror-gutters" style="height: 291px;"><div class="CodeMirror-gutter CodeMirror-linenumbers" style="width: 30px;"></div></div></div></div></pre><h2 id='实体关系图'><span>实体关系图</span></h2><h6 id='实体关系图也称为er图）'><span>实体关系图（也称为：ER图）</span></h6><div class="md-diagram-panel md-fences-adv-panel"><svg id="mermaidChart10" width="100%" xmlns="http://www.w3.org/2000/svg" height="465" style="max-width: 389.53125px;" viewBox="0 0 389.53125 465" class="md-require-zoom-fix"><style>#mermaidChart10{font-family:sans-serif;font-size:16px;fill:#333;}#mermaidChart10 .error-icon{fill:#552222;}#mermaidChart10 .error-text{fill:#552222;stroke:#552222;}#mermaidChart10 .edge-thickness-normal{stroke-width:2px;}#mermaidChart10 .edge-thickness-thick{stroke-width:3.5px;}#mermaidChart10 .edge-pattern-solid{stroke-dasharray:0;}#mermaidChart10 .edge-pattern-dashed{stroke-dasharray:3;}#mermaidChart10 .edge-pattern-dotted{stroke-dasharray:2;}#mermaidChart10 .marker{fill:#333333;}#mermaidChart10 .marker.cross{stroke:#333333;}#mermaidChart10 svg{font-family:sans-serif;font-size:16px;}#mermaidChart10 .entityBox{fill:#ECECFF;stroke:#9370DB;}#mermaidChart10 .relationshipLabelBox{fill:hsl(80,100%,96.2745098039%);opacity:0.7;background-color:hsl(80,100%,96.2745098039%);}#mermaidChart10 .relationshipLabelBox rect{opacity:0.5;}#mermaidChart10 .relationshipLine{stroke:#333333;}#mermaidChart10:root{--mermaid-font-family:sans-serif;}#mermaidChart10:root{--mermaid-alt-font-family:sans-serif;}#mermaidChart10 er{fill:apa;}</style><g></g><defs><marker id="ONLY_ONE_START" refX="0" refY="9" markerWidth="18" markerHeight="18" orient="auto"><path stroke="gray" fill="none" d="M9,0 L9,18 M15,0 L15,18"></path></marker></defs><defs><marker id="ONLY_ONE_END" refX="18" refY="9" markerWidth="18" markerHeight="18" orient="auto"><path stroke="gray" fill="none" d="M3,0 L3,18 M9,0 L9,18"></path></marker></defs><defs><marker id="ZERO_OR_ONE_START" refX="0" refY="9" markerWidth="30" markerHeight="18" orient="auto"><circle stroke="gray" fill="white" cx="21" cy="9" r="6"></circle><path stroke="gray" fill="none" d="M9,0 L9,18"></path></marker></defs><defs><marker id="ZERO_OR_ONE_END" refX="30" refY="9" markerWidth="30" markerHeight="18" orient="auto"><circle stroke="gray" fill="white" cx="9" cy="9" r="6"></circle><path stroke="gray" fill="none" d="M21,0 L21,18"></path></marker></defs><defs><marker id="ONE_OR_MORE_START" refX="18" refY="18" markerWidth="45" markerHeight="36" orient="auto"><path stroke="gray" fill="none" d="M0,18 Q 18,0 36,18 Q 18,36 0,18 M42,9 L42,27"></path></marker></defs><defs><marker id="ONE_OR_MORE_END" refX="27" refY="18" markerWidth="45" markerHeight="36" orient="auto"><path stroke="gray" fill="none" d="M3,9 L3,27 M9,18 Q27,0 45,18 Q27,36 9,18"></path></marker></defs><defs><marker id="ZERO_OR_MORE_START" refX="18" refY="18" markerWidth="57" markerHeight="36" orient="auto"><circle stroke="gray" fill="white" cx="48" cy="18" r="6"></circle><path stroke="gray" fill="none" d="M0,18 Q18,0 36,18 Q18,36 0,18"></path></marker></defs><defs><marker id="ZERO_OR_MORE_END" refX="39" refY="18" markerWidth="57" markerHeight="36" orient="auto"><circle stroke="gray" fill="white" cx="9" cy="18" r="6"></circle><path stroke="gray" fill="none" d="M21,18 Q39,0 57,18 Q39,36 21,18"></path></marker></defs><path class="er relationshipLine" d="M134.21875,95L123.515625,103.33333333333333C112.8125,111.66666666666667,91.40625,128.33333333333334,80.703125,145C70,161.66666666666666,70,178.33333333333334,70,186.66666666666666L70,195" stroke="gray" fill="none" marker-end="url(#ZERO_OR_MORE_END)" marker-start="url(#ONLY_ONE_START)"></path><path class="er relationshipLine" d="M70,270L70,278.3333333333333C70,286.6666666666667,70,303.3333333333333,70,320C70,336.6666666666667,70,353.3333333333333,70,361.6666666666667L70,370" stroke="gray" fill="none" marker-end="url(#ONE_OR_MORE_END)" marker-start="url(#ONLY_ONE_START)"></path><path class="er relationshipLine" d="M230.546875,95L241.25,103.33333333333333C251.953125,111.66666666666667,273.359375,128.33333333333334,284.0625,145C294.765625,161.66666666666666,294.765625,178.33333333333334,294.765625,186.66666666666666L294.765625,195" stroke="gray" fill="none" stroke-dasharray="8,8" marker-end="url(#ONE_OR_MORE_END)" marker-start="url(#ONE_OR_MORE_START)"></path><g id="CUSTOMER" transform="translate(132.3828125,20 )"><rect class="er entityBox" fill="honeydew" fill-opacity="100%" stroke="gray" x="0" y="0" width="100" height="75"></rect><text class="er entityLabel" id="entity-CUSTOMER" x="0" y="0" dominant-baseline="middle" text-anchor="middle" style="font-family: sans-serif; font-size: 12px" transform="translate(50,37.5)">CUSTOMER</text></g><g id="ORDER" transform="translate(20,195 )"><rect class="er entityBox" fill="honeydew" fill-opacity="100%" stroke="gray" x="0" y="0" width="100" height="75"></rect><text class="er entityLabel" id="entity-ORDER" x="0" y="0" dominant-baseline="middle" text-anchor="middle" style="font-family: sans-serif; font-size: 12px" transform="translate(50,37.5)">ORDER</text></g><g id="LINE-ITEM" transform="translate(20,370 )"><rect class="er entityBox" fill="honeydew" fill-opacity="100%" stroke="gray" x="0" y="0" width="100" height="75"></rect><text class="er entityLabel" id="entity-LINE-ITEM" x="0" y="0" dominant-baseline="middle" text-anchor="middle" style="font-family: sans-serif; font-size: 12px" transform="translate(50,37.5)">LINE-ITEM</text></g><g id="DELIVERY-ADDRESS" transform="translate(220,195 )"><rect class="er entityBox" fill="honeydew" fill-opacity="100%" stroke="gray" x="0" y="0" width="149.53125" height="75"></rect><text class="er entityLabel" id="entity-DELIVERY-ADDRESS" x="0" y="0" dominant-baseline="middle" text-anchor="middle" style="font-family: sans-serif; font-size: 12px" transform="translate(74.765625,37.5)">DELIVERY-ADDRESS</text></g><rect class="er relationshipLabelBox" x="70.05120086669922" y="129.5390625" width="34.171875" height="13.640625" fill="white" fill-opacity="85%"></rect><text class="er relationshipLabel" id="rel1" x="87.13713836669922" y="136.359375" text-anchor="middle" dominant-baseline="middle" style="font-family: sans-serif; font-size: 12px">places</text><rect class="er relationshipLabelBox" x="47.984375" y="313.1796875" width="44.03125" height="13.640625" fill="white" fill-opacity="85%"></rect><text class="er relationshipLabel" id="rel2" x="70" y="320" text-anchor="middle" dominant-baseline="middle" style="font-family: sans-serif; font-size: 12px">contains</text><rect class="er relationshipLabelBox" x="265.13629150390625" y="129.5390625" width="24.984375" height="13.640625" fill="white" fill-opacity="85%"></rect><text class="er relationshipLabel" id="rel3" x="277.62847900390625" y="136.359375" text-anchor="middle" dominant-baseline="middle" style="font-family: sans-serif; font-size: 12px">uses</text></svg></div><h2 id='客户旅程地图'><span>客户旅程地图</span></h2><h6 id='客户旅程地图也称用户体验地图）'><span>客户旅程地图（也称：用户体验地图）</span></h6><div class="md-diagram-panel md-fences-adv-panel"><svg id="mermaidChart11" width="100%" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" height="470" style="max-width: 1300px;" viewBox="0 -25 1300 540" preserveAspectRatio="xMinYMin meet" class="md-require-zoom-fix"><style>#mermaidChart11{font-family:sans-serif;font-size:16px;fill:#333;}#mermaidChart11 .error-icon{fill:#552222;}#mermaidChart11 .error-text{fill:#552222;stroke:#552222;}#mermaidChart11 .edge-thickness-normal{stroke-width:2px;}#mermaidChart11 .edge-thickness-thick{stroke-width:3.5px;}#mermaidChart11 .edge-pattern-solid{stroke-dasharray:0;}#mermaidChart11 .edge-pattern-dashed{stroke-dasharray:3;}#mermaidChart11 .edge-pattern-dotted{stroke-dasharray:2;}#mermaidChart11 .marker{fill:#333333;}#mermaidChart11 .marker.cross{stroke:#333333;}#mermaidChart11 svg{font-family:sans-serif;font-size:16px;}#mermaidChart11 .label{font-family:'trebuchet ms',verdana,arial;font-family:var(--mermaid-font-family);color:#333;}#mermaidChart11 .mouth{stroke:#666;}#mermaidChart11 line{stroke:#333;}#mermaidChart11 .legend{fill:#333;}#mermaidChart11 .label text{fill:#333;}#mermaidChart11 .label{color:#333;}#mermaidChart11 .face{fill:#FFF8DC;stroke:#999;}#mermaidChart11 .node rect,#mermaidChart11 .node circle,#mermaidChart11 .node ellipse,#mermaidChart11 .node polygon,#mermaidChart11 .node path{fill:#ECECFF;stroke:#9370DB;stroke-width:1px;}#mermaidChart11 .node .label{text-align:center;}#mermaidChart11 .node.clickable{cursor:pointer;}#mermaidChart11 .arrowheadPath{fill:#333333;}#mermaidChart11 .edgePath .path{stroke:#333333;stroke-width:1.5px;}#mermaidChart11 .flowchart-link{stroke:#333333;fill:none;}#mermaidChart11 .edgeLabel{background-color:#e8e8e8;text-align:center;}#mermaidChart11 .edgeLabel rect{opacity:0.5;}#mermaidChart11 .cluster text{fill:#333;}#mermaidChart11 div.mermaidTooltip{position:absolute;text-align:center;max-width:200px;padding:2px;font-family:'trebuchet ms',verdana,arial;font-family:var(--mermaid-font-family);font-size:12px;background:hsl(80,100%,96.2745098039%);border:1px solid #aaaa33;border-radius:2px;pointer-events:none;z-index:100;}#mermaidChart11 .task-type-0,#mermaidChart11 .section-type-0{fill:#ECECFF;}#mermaidChart11 .task-type-1,#mermaidChart11 .section-type-1{fill:#ffffde;}#mermaidChart11 .task-type-2,#mermaidChart11 .section-type-2{fill:hsl(304,100%,96.2745098039%);}#mermaidChart11 .task-type-3,#mermaidChart11 .section-type-3{fill:hsl(124,100%,93.5294117647%);}#mermaidChart11 .task-type-4,#mermaidChart11 .section-type-4{fill:hsl(176,100%,96.2745098039%);}#mermaidChart11 .task-type-5,#mermaidChart11 .section-type-5{fill:hsl(-4,100%,93.5294117647%);}#mermaidChart11 .task-type-6,#mermaidChart11 .section-type-6{fill:hsl(8,100%,96.2745098039%);}#mermaidChart11 .task-type-7,#mermaidChart11 .section-type-7{fill:hsl(188,100%,93.5294117647%);}#mermaidChart11:root{--mermaid-font-family:sans-serif;}#mermaidChart11:root{--mermaid-alt-font-family:sans-serif;}#mermaidChart11 journey{fill:apa;}</style><g></g><defs><marker id="arrowhead" refX="5" refY="2" markerWidth="6" markerHeight="4" orient="auto"><path d="M 0,0 V 4 L6,2 Z"></path></marker></defs><circle cx="20" cy="60" fill="#8FBC8F" stroke="#000" r="7"></circle><text x="40" y="67" class="legend"><tspan x="50">Cat</tspan></text><circle cx="20" cy="80" fill="#7CFC00" stroke="#000" r="7"></circle><text x="40" y="87" class="legend"><tspan x="50">Me</tspan></text><g><rect x="150" y="50" fill="#191970" width="150" height="65" rx="3" ry="3" class="journey-section section-type-0"></rect><switch><foreignObject x="150" y="50" width="150" height="65" position="fixed"><div class="journey-section section-type-0" style="display: table; height: 100%; width: 100%;"><div class="label" style="display: table-cell; text-align: center; vertical-align: middle;">Go to work</div></div></foreignObject><text x="225" y="82.5" dominant-baseline="central" alignment-baseline="central" class="journey-section section-type-0" style="text-anchor: middle; font-size: 14px; font-family: Open-Sans, sans-serif;"><tspan x="225" dy="0">Go to work</tspan></text></switch></g><g><line id="task0" x1="225" y1="140" x2="225" y2="450" class="task-line" stroke-width="1px" stroke-dasharray="4 2" stroke="#666"></line><circle cx="225" cy="300" class="face" r="15" stroke-width="2" overflow="visible"></circle><g><circle cx="220" cy="295" r="1.5" stroke-width="2" fill="#666" stroke="#666"></circle><circle cx="230" cy="295" r="1.5" stroke-width="2" fill="#666" stroke="#666"></circle><path class="mouth" d="M7.5,0A7.5,7.5,0,1,1,-7.5,9.18485099360515e-16L-6.8181818181818175,8.349864539641044e-16A6.8181818181818175,6.8181818181818175,0,1,0,6.8181818181818175,0Z" transform="translate(225,302)"></path></g><rect x="150" y="140" fill="#191970" width="150" height="65" rx="3" ry="3" class="task task-type-0"></rect><circle cx="164" cy="140" fill="#7CFC00" stroke="#000" r="7"><title>Me</title></circle><switch><foreignObject x="150" y="140" width="150" height="65" position="fixed"><div class="task" style="display: table; height: 100%; width: 100%;"><div class="label" style="display: table-cell; text-align: center; vertical-align: middle;">Make tea</div></div></foreignObject><text x="225" y="172.5" dominant-baseline="central" alignment-baseline="central" class="task" style="text-anchor: middle; font-size: 14px; font-family: Open-Sans, sans-serif;"><tspan x="225" dy="0">Make tea</tspan></text></switch></g><g><line id="task1" x1="425" y1="140" x2="425" y2="450" class="task-line" stroke-width="1px" stroke-dasharray="4 2" stroke="#666"></line><circle cx="425" cy="360" class="face" r="15" stroke-width="2" overflow="visible"></circle><g><circle cx="420" cy="355" r="1.5" stroke-width="2" fill="#666" stroke="#666"></circle><circle cx="430" cy="355" r="1.5" stroke-width="2" fill="#666" stroke="#666"></circle><line class="mouth" stroke="#666" x1="420" y1="367" x2="430" y2="367" stroke-width="1px"></line></g><rect x="350" y="140" fill="#191970" width="150" height="65" rx="3" ry="3" class="task task-type-0"></rect><circle cx="364" cy="140" fill="#7CFC00" stroke="#000" r="7"><title>Me</title></circle><switch><foreignObject x="350" y="140" width="150" height="65" position="fixed"><div class="task" style="display: table; height: 100%; width: 100%;"><div class="label" style="display: table-cell; text-align: center; vertical-align: middle;">Go upstairs</div></div></foreignObject><text x="425" y="172.5" dominant-baseline="central" alignment-baseline="central" class="task" style="text-anchor: middle; font-size: 14px; font-family: Open-Sans, sans-serif;"><tspan x="425" dy="0">Go upstairs</tspan></text></switch></g><g><line id="task2" x1="625" y1="140" x2="625" y2="450" class="task-line" stroke-width="1px" stroke-dasharray="4 2" stroke="#666"></line><circle cx="625" cy="420" class="face" r="15" stroke-width="2" overflow="visible"></circle><g><circle cx="620" cy="415" r="1.5" stroke-width="2" fill="#666" stroke="#666"></circle><circle cx="630" cy="415" r="1.5" stroke-width="2" fill="#666" stroke="#666"></circle><path class="mouth" d="M-7.5,9.18485099360515e-16A7.5,7.5,0,1,1,7.5,-1.83697019872103e-15L6.8181818181818175,-1.6699729079282088e-15A6.8181818181818175,6.8181818181818175,0,1,0,-6.8181818181818175,8.349864539641044e-16Z" transform="translate(625,427)"></path></g><rect x="550" y="140" fill="#191970" width="150" height="65" rx="3" ry="3" class="task task-type-0"></rect><circle cx="564" cy="140" fill="#7CFC00" stroke="#000" r="7"><title>Me</title></circle><circle cx="574" cy="140" fill="#8FBC8F" stroke="#000" r="7"><title>Cat</title></circle><switch><foreignObject x="550" y="140" width="150" height="65" position="fixed"><div class="task" style="display: table; height: 100%; width: 100%;"><div class="label" style="display: table-cell; text-align: center; vertical-align: middle;">Do work</div></div></foreignObject><text x="625" y="172.5" dominant-baseline="central" alignment-baseline="central" class="task" style="text-anchor: middle; font-size: 14px; font-family: Open-Sans, sans-serif;"><tspan x="625" dy="0">Do work</tspan></text></switch></g><g><rect x="750" y="50" fill="#8B008B" width="150" height="65" rx="3" ry="3" class="journey-section section-type-1"></rect><switch><foreignObject x="750" y="50" width="150" height="65" position="fixed"><div class="journey-section section-type-1" style="display: table; height: 100%; width: 100%;"><div class="label" style="display: table-cell; text-align: center; vertical-align: middle;">Go home</div></div></foreignObject><text x="825" y="82.5" dominant-baseline="central" alignment-baseline="central" class="journey-section section-type-1" style="text-anchor: middle; font-size: 14px; font-family: Open-Sans, sans-serif;"><tspan x="825" dy="0">Go home</tspan></text></switch></g><g><line id="task3" x1="825" y1="140" x2="825" y2="450" class="task-line" stroke-width="1px" stroke-dasharray="4 2" stroke="#666"></line><circle cx="825" cy="300" class="face" r="15" stroke-width="2" overflow="visible"></circle><g><circle cx="820" cy="295" r="1.5" stroke-width="2" fill="#666" stroke="#666"></circle><circle cx="830" cy="295" r="1.5" stroke-width="2" fill="#666" stroke="#666"></circle><path class="mouth" d="M7.5,0A7.5,7.5,0,1,1,-7.5,9.18485099360515e-16L-6.8181818181818175,8.349864539641044e-16A6.8181818181818175,6.8181818181818175,0,1,0,6.8181818181818175,0Z" transform="translate(825,302)"></path></g><rect x="750" y="140" fill="#8B008B" width="150" height="65" rx="3" ry="3" class="task task-type-1"></rect><circle cx="764" cy="140" fill="#7CFC00" stroke="#000" r="7"><title>Me</title></circle><switch><foreignObject x="750" y="140" width="150" height="65" position="fixed"><div class="task" style="display: table; height: 100%; width: 100%;"><div class="label" style="display: table-cell; text-align: center; vertical-align: middle;">Go downstairs</div></div></foreignObject><text x="825" y="172.5" dominant-baseline="central" alignment-baseline="central" class="task" style="text-anchor: middle; font-size: 14px; font-family: Open-Sans, sans-serif;"><tspan x="825" dy="0">Go downstairs</tspan></text></switch></g><g><line id="task4" x1="1025" y1="140" x2="1025" y2="450" class="task-line" stroke-width="1px" stroke-dasharray="4 2" stroke="#666"></line><circle cx="1025" cy="300" class="face" r="15" stroke-width="2" overflow="visible"></circle><g><circle cx="1020" cy="295" r="1.5" stroke-width="2" fill="#666" stroke="#666"></circle><circle cx="1030" cy="295" r="1.5" stroke-width="2" fill="#666" stroke="#666"></circle><path class="mouth" d="M7.5,0A7.5,7.5,0,1,1,-7.5,9.18485099360515e-16L-6.8181818181818175,8.349864539641044e-16A6.8181818181818175,6.8181818181818175,0,1,0,6.8181818181818175,0Z" transform="translate(1025,302)"></path></g><rect x="950" y="140" fill="#8B008B" width="150" height="65" rx="3" ry="3" class="task task-type-1"></rect><circle cx="964" cy="140" fill="#7CFC00" stroke="#000" r="7"><title>Me</title></circle><switch><foreignObject x="950" y="140" width="150" height="65" position="fixed"><div class="task" style="display: table; height: 100%; width: 100%;"><div class="label" style="display: table-cell; text-align: center; vertical-align: middle;">Sit down</div></div></foreignObject><text x="1025" y="172.5" dominant-baseline="central" alignment-baseline="central" class="task" style="text-anchor: middle; font-size: 14px; font-family: Open-Sans, sans-serif;"><tspan x="1025" dy="0">Sit down</tspan></text></switch></g><text x="150" font-size="4ex" font-weight="bold" y="25">我一天的工作</text><line x1="150" y1="260" x2="1146" y2="260" stroke-width="4" stroke="black" marker-end="url(#arrowhead)"></line></svg></div><h1 id='备选方案'><span>备选方案</span></h1><p><code>#注意#</code><strong><span>（从 VLOOK 9.2 版本开始不再支持备选方案）</span></strong></p><h2 id='flowchartjs-流程图'><span>flowchart.js (流程图)</span></h2><p><span>flowchart.js 基于 SVG 的流程图插件，它仅需几行代码即可在 Web 上完成流程图的构建。可以从文字表述中画出简单的 SVG 流程图，也可以画出彩色的图表。详见 </span><a href='http://flowchart.js.org'><span>flowchart.js 官网</span></a><span>。</span></p><h2 id='js-sequence-diagrams-顺序图'><span>JS Sequence Diagrams (顺序图)</span></h2><p><span>JS sequence diagrams 是一个方便建立 UML 的顺序图（序列图 or 循序图）在线工具，使用简单。详见 </span><a href='https://bramp.github.io/js-sequence-diagrams/'><span>JS Sequence Diagrams 官网</span></a><span>。</span></p><h6 id='the-end'><span>The End </span></h6></div></div>
<div class="mdx-vlook-inside"></div>
<style type="text/css">
    :root { --vlook-color: #FFFFFF; --vlook-background: #808488; }
    @keyframes breathe-vlook { 0% { transform: scale(1.5); opacity: 0.5; } 100% { transform: scale(1); opacity: 1; } }
    @media (prefers-color-scheme: dark) { :root { --vlook-color: #181A1E; } }
    #VLOOK { left: 0; top: 0; background: var(--vlook-color); width: 100%; height: 100vh; display: flex; align-items: center; position: fixed; z-index: 99999; }
    #VLOOK > div { margin: 0 auto; background: var(--vlook-background); width: 30px; height: 30px; border-radius: 10px; animation: 1s breathe-vlook infinite alternate; }
</style>
<div id="VLOOK"><div></div></div>
<!-- ==================== VLOOK JS ==================== -->
<script type="text/javascript">
    let liveVersion = "V10.7.1-dev";
    let vlookDevMode = liveVersion.indexOf("dev") > 0 ? true : false, vlookDebugMode = false;
    let fontHost = "https://cdn.jsdelivr.net/gh/MadMaxChow/openfonts@master/",
        jsHost = vlookDevMode ? "http://localhost/js/" : "https://madmaxchow.gitee.io/vlook/js/",
        cssHost = vlookDevMode ? "http://localhost/css/" : "https://madmaxchow.gitee.io/vlook/css/";
        // https://cdn.jsdelivr.net/gh/MadMaxChow/VLOOK@master/docs/
// ==================== NON-standalone ====================
// ▽ ▽ ▽ ▽ ▽
    let startjs = document.createElement("script"),
        ts = vlookDevMode ? new Date().getTime() : Math.round(new Date().getTime()/1000/60); // 1000/60/60/24 按天
    startjs.setAttribute("type", "text/javascript");
    startjs.setAttribute("src", jsHost + "start.js?ts=" + ts);
    document.getElementsByTagName("HEAD")[0].appendChild(startjs);
</script>
<!--========================================================================-->
<!--                              END OF VLOOK                              -->
<!--========================================================================-->
</body>
</html>